Du bist nicht angemeldet.

Stilllegung des Forums
Das Forum wurde am 05.06.2023 nach über 20 Jahren stillgelegt (weitere Informationen und ein kleiner Rückblick).
Registrierungen, Anmeldungen und Postings sind nicht mehr möglich. Öffentliche Inhalte sind weiterhin zugänglich.
Das Team von spieleprogrammierer.de bedankt sich bei der Community für die vielen schönen Jahre.
Wenn du eine deutschsprachige Spieleentwickler-Community suchst, schau doch mal im Discord und auf ZFX vorbei!

Wie kann man folgende Funktion programmieren und wie heißt sie?

Werbeanzeige

Kostap

unregistriert

31

25.06.2011, 01:55

Ich habe noch etwas gefunden und das funktioniert:

<div id="details" style="position:absolute; width:200px; height:115px; z-index:1; left: 750px; top: 10px; background-color: #0000FF; layer-background-color: #0000FF; border: 1px none #000000; visibility: hidden">Hier
is die ebene...^^</div>
<p><a href="#" onMouseOver="document.getElementById('details').style.visibility='visible';" onMouseOut="document.getElementById('details').style.visibility='hidden';">Details</a></p>

Das Problem ist aber dass man mit diesem Code nicht auf das Fenster cklicken kann. Es erscheint nur nebenbei als Info und verschwiendet wieder.

BurningWave

Alter Hase

Beiträge: 1 106

Wohnort: Filderstadt/Konstanz

Beruf: Student

  • Private Nachricht senden

32

25.06.2011, 01:56

Dieser Code ist, so wie er dasteht, Unsinn. Der Link würde Funktionen aufrufen, die du gar nicht definiert hast. Und wie gesagt: Vergiss JavaScript. Lerne HTML und CSS!
Coderaten zu spielen hilt niemandem ;)

EDIT: Der Code, den du gerade noch gepostet hast funktioniert, ja. Jedoch hilft dir das nichts, wenn du ihn nicht verstehst. Mit ein bisschen HTML-Kenntnissen, wüsstest du, was du verändern müsstest...

Kostap

unregistriert

33

25.06.2011, 01:59

Für mich ist das wie chinesisch :lol:

Ich kann es ja versuchen aber was rauskommt weiiß ich nicht.
Es wäre aber gut zu erst zu lernen wie man diese bestimmte Sache erledigen kann.

Kostap

unregistriert

34

25.06.2011, 02:00

Zitat von »BurningWave«

EDIT: Der Code, den du gerade noch gepostet hast funktioniert, ja. Jedoch hilft dir das nichts, wenn du ihn nicht verstehst. Mit ein bisschen HTML-Kenntnissen, wüsstest du, was du verändern müsstest...
Dann sag es mir doch bitte! ;(

Chromanoid

Alter Hase

Beiträge: 1 410

  • Private Nachricht senden

35

25.06.2011, 02:47

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<div>
<!-- deine Karte -->
<img src="test.jpeg" alt="">

<!-- ein Marker/Tooltip-->
<div style="left:100px;top:80px;position:absolute;min-width:15px;min-height:15px;background-color:red;" onMouseOver="this.firstChild.style.display='block';" onMouseOut="this.firstChild.style.display='none';"><div style="display:none;z-index:1000">
<a href="#" style="position:absolute;bottom:5px;left:5px;background-color:green;white-space: nowrap;padding:2px;">Toooltip Text1</a></div>
</div>

<!-- ein weiterer Marker/Tooltip -->
<div style="left:200px;top:100px;position:absolute;min-width:15px;min-height:15px;background-color:red;" onMouseOver="this.firstChild.style.display='block';" onMouseOut="this.firstChild.style.display='none';"><div style="display:none;z-index:1000">
<a href="#" style="position:absolute;bottom:5px;left:5px;background-color:green;white-space: nowrap;padding:2px;">Toooltip Text2</a></div>
</div>

</div>

Versuche mal das zu verstehen, dann sollte das kein Problem mehr für dich sein.
test.jpeg ist deine karte
top/left die koordinaten des marker-punktes in pixel zur oberen linken ecke des bildes bzw. des umschließenden div-elements
momentan wird das erste innere element des markers (das div element im marker-div element) je nach mauszustand ein und ausgeblendet. Achtung das tooltip-div (das mit display:none als style) muss in diesem fall direkt hinter dem marker-div-element kommen, da leerzeichen bei den meisten browsern als eigenes element zählen und der tooltip dann also nicht mehr ein und ausgeblendet wird, sondern die leerzeichen/absätze, die man ja sowieso nicht sehen kann.

PS: Was man nicht alles treibt, wenn einem langweilig ist und man nicht arbeiten oder schlafen will ^^
Besucht auch mal ZFX + Developia: Forum für Spieleentwicklung & TIGSource Forums: Independent Gaming Discussion

Dieser Beitrag wurde bereits 18 mal editiert, zuletzt von »Chromanoid« (25.06.2011, 03:40)

Kostap

unregistriert

36

25.06.2011, 03:49

Hallo


Chromanoid,

du hast dir Mühe gegeben. Das war prima. Danke dir. :thumbsup:
Ich muss das erstmal verdauen :D aber soweit ich es noch beurteilen kann habe ich es verstanden.
Nun noch eine Sache. (also was du mir gegeben hast ist perfekt) aber wie kann man diese Fenster vergrößern wenn man drauf klickt?

Ja , du hast schon Recht. Seit ich damit angefangen habe schlafe ich nicht mehr :wacko:

DeKugelschieber

Community-Fossil

Beiträge: 2 641

Wohnort: Rheda-Wiedenbrück

Beruf: Software-Entwickler

  • Private Nachricht senden

37

26.06.2011, 22:23

Quellcode

 
1

min-width:15px;min-height:15px;


Steht bei div style="... Falls du Feste größen willst (z.B. damit ein Bild das div nicht vergrößert) kannst du auch "width:...px;" und height:...px;" einfügen.

MfG
Grüße, Kugel

GitHub Meine Firma Pirsch Analytics

Chromanoid

Alter Hase

Beiträge: 1 410

  • Private Nachricht senden

38

27.06.2011, 00:57

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

<script type="text/javascript">
//<!--
var momentanesElement=null;
function elementAnzeigen(element) {
    if(momentanesElement!=null)
        momentanesElement.style.display='none';
    momentanesElement=element;  
    if(element!=null)
        element.style.display='block';      
}
//-->
</script>

<div>
<!-- deine Karte -->
<img src="test.jpeg" alt="">

<!-- ein Marker/Tooltip-->
<div style="left:100px;top:80px;position:absolute;min-width:15px;min-height:15px;background-color:red;" onMouseOver="if(lastChild.previousSibling!=momentanesElement)lastChild.style.display='block';" onMouseOut="lastChild.style.display='none';">
<div id="boxId1" style="display:none;position:absolute;bottom:5px;left:5px;background-color:yellow;">Eine Beschreibung. <a href="#" onClick="elementAnzeigen(null)">schließen</a>
</div><div style="display:none;z-index:1001" onClick="elementAnzeigen(previousSibling);style.display='none';">
<a href="#" style="position:absolute;bottom:5px;left:5px;background-color:green;white-space: nowrap;padding:2px;">Toooltip Text1</a></div></div>

<!-- ein weiterer Marker/Tooltip-->
<div style="left:140px;top:100px;position:absolute;min-width:15px;min-height:15px;background-color:red;" onMouseOver="if(lastChild.previousSibling!=momentanesElement)lastChild.style.display='block';" onMouseOut="lastChild.style.display='none';">
<div id="boxId1" style="display:none;position:absolute;bottom:5px;left:5px;background-color:yellow;">Eine Beschreibung 2. <a href="#" onClick="elementAnzeigen(null)">schließen</a>
</div><div style="display:none;z-index:1001" onClick="elementAnzeigen(previousSibling);style.display='none';">
<a href="#" style="position:absolute;bottom:5px;left:5px;background-color:green;white-space: nowrap;padding:2px;">Toooltip Text1</a></div></div>

</div>
Der Script ist dazu da, dass immer nur eine Box angezeigt wird. Außerdem wird jetzt mit lastChild für den Tooltip und lastChild.previousSibling für die Beschreibung gearbeitet. Der Tooltip-Div muss also am Ende des Marker-Divs sein und die beschreibung direkt davor.
Besucht auch mal ZFX + Developia: Forum für Spieleentwicklung & TIGSource Forums: Independent Gaming Discussion

Kostap

unregistriert

39

27.06.2011, 16:41

Hallo DeKugelschieber und Chromanoid
ich danke euch für eure Mühe.

Ich habe ein Programm im Internet endeckt , dass für Anfänger ?( wie mich geeignet sein soll.
Da kann ich eine Karte laden und drauf kleine Bilder (die wie einen Punkt aussehen) installieren.

(Link)


Dann kann ich dem kleinen "Punkt-Bild" einen Code hinzufügn damit es sich so "verhällt" wie die orange Pins der yahoo map , wenn man sie mit der
Maus berührt. Wie hier: http://de.maps.yahoo.com/#mvt=m&lat=50.3…&tp=1&ioride=de
Dann sieht es so aus:

(Link)


Welchen code soll ich nun hinzufügen?
Ich habe alle ausprobiert , die ich hier erhalten habe , aber die funktionieren nicht (was sogar ich verstehen kann, denn die Umstände jetzt sind andere :whistling:

Ich freue mich auf eure Hilfe. 8o
MFG

Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von »Kostap« (27.06.2011, 16:47)

Werbeanzeige

Ähnliche Themen