style="left:xyz; top:zyx;" sird ignoriert

[Wolle]

Hallo liebe Gemeinde :)

Ich versuch bei mir ein Usermap System laufen zu lassen
und möchte es in mein CMS einbinden.

Datenbankabfrage etc. funktioniert auch prima
und im Quelltext ist zu sehen, dass die Parameter (xyz & zyx)
scheinbar korrekt übergeben werden.

Funktioniert hier code ?

Mal probieren...

  
<div id="content">  
 <div class="articleText">  
  <div id="map">  
   <div id="inf">  
   </div>  
<a href="?l=41,51" onMouseOut="h();" onMouseOver="s(this, '<h2>Hannover</h2> Test1');" class="p1" style="left:205; top:255"></a>  
  
<a href="?l=35,36" onMouseOut="h();" onMouseOver="s(this, '<h2>Bremen</h2> Test2, Test3');" class="p2" style="left:175; top:180"></a>  
  </div>  
 </div>  
</div>  

Nun liegt das Problem darin, dass style="left:xyz; top:zyx"
einfach ignoriert werden.

Die Punkt welche gezeichnet werden, landen links oben.

Egal was ich mach.

Meine CSS schaut so aus:
http://www.golfcabrio.de/cms_template/inc_css/main.css

Ich weiss, noch bischen wüst,
aber sollte ja dem Setzen der Punkte an die Richtige
Position ja keinen Abbruch tun.

Hoffe ich zumindest *gg*

Wer das ganze übel mal sehen möchte:
http://www.golfcabrio.de/index.php?map

Ich muss zu meinem Bedauern zugeben.
Dass ich bisher nur mit Tabellen gepfuscht hab und ohne CSS.
Eigne mir das seit kurzem erst an, daher bitte um Rücksicht.

Wenn mir eine DEN Tip gibt,
spendier ich auch gern eine Tüte Gummibärchen :)

Hoffe mir kann wer helfen.

Gruß Wolle

[Klawischnigg]

Hi there,

schreibst halt Einheiten dazu...

[timon]

Hallo liebe Gemeinde :)

style="left:205; top:255"

Gruß Wolle

hi,

wie wär's wenn man noch vorher das attribut "position" angiebt? woher soll der browser denn sonst wissen, dass das element eine variable position hat?

Außerdem gibt es bei selfhtml auch eine suchfunktion...

:)

[timon]

wie wär's wenn man noch vorher das attribut "position" angiebt? woher soll der browser denn sonst wissen, dass das element eine variable position hat?

und die Einheit (z.b. px) würde ich auch versuchen nicht zu vergessen...

[Orlando]

style="left:205; top:255"
style="left:175; top:180"

Nun liegt das Problem darin, dass style="left:xyz; top:zyx"
einfach ignoriert werden.

Das ist auch richtig so, denn es fehlt http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=position:absolute, ohne das http://de.selfhtml.org/css/eigenschaften/positionierung.htm#left@title=left und http://de.selfhtml.org/css/eigenschaften/positionierung.htm#top@title=top nicht wirken können … weswegen die Beschreibungen beider Eigenschaften als ersten Satz folgende Anmerkung enthalten:

„Diese Angabe ist sinnvoll in Verbindung mit einer Angabe zu position.“

Roland

[Wolle]

style="left:205; top:255"
style="left:175; top:180"

Nun liegt das Problem darin, dass style="left:xyz; top:zyx"
einfach ignoriert werden.

Das ist auch richtig so, denn es fehlt http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=position:absolute, ohne das http://de.selfhtml.org/css/eigenschaften/positionierung.htm#left@title=left und http://de.selfhtml.org/css/eigenschaften/positionierung.htm#top@title=top nicht wirken können … weswegen die Beschreibungen beider Eigenschaften als ersten Satz folgende Anmerkung enthalten:

„Diese Angabe ist sinnvoll in Verbindung mit einer Angabe zu position.“

Roland

Hallöle und danke für den Hinweis.
Habs nun gesetzt;
ein Link sieht so aus:
<a href="?l=35,36" onMouseOut="h();" onMouseOver="s(this, '<h2>Bremen</h2> Test2, Test3');" class="p2" style="position:absolute; left:175px; top:180px"></a>

Allerdings auch hier, keine Verbesserung :(
Oder hab ich es nun falsch verstanden ?

Gruß & Danke schonmal, Wolle

[Wolle]

Sooo... :)

Er setzt die Punkte wenn ich aus:

  
 echo '<a href="?l='.$x.','.$y.'" onMouseOut="h();" onMouseOver="s(this, \''.$s.'\');" class="'.$cssClass.'" style="left:'.($x*RASTER_SIZE).'; top:'.($y*RASTER_SIZE).'"></a>'."\n";  

Folgendes mache:

  
 echo '<a href="?l='.$x.','.$y.'" onMouseOut="h();" onMouseOver="s(this, \''.$s.'\');" class="'.$cssClass.'" style="left:'.($x*RASTER_SIZE).'px; top:'.($y*RASTER_SIZE).'px"></a>'."\n";  

Soweit so gut...

mittels JS lass ich bei einem OnMouseOver einen Kasten einblenden:

  
// Funktionen zum anzeigen/verstecken des Mouse-Over-DIVs  
  
  
// Anzeigen u. Position / Inhalt setzen  
function s(e, s) {  
 var d = document.getElementById('inf');  
 d.style.display="block";  
 d.style.left= parseInt(e.style.left)+15;  
 d.style.top= parseInt(e.style.top)+10;  
 d.innerHTML=s;  
}  
  
// Verstecken  
function h() {  
 document.getElementById('inf').style.display="none";  
}  

Und das Funktioniert nun wieder nicht.
Er soll, wie man sieht, 15px nach Rechts und 10px nach unten,
das OnMouseOver Element anzeigen.

Er macht das aber Stur oben Links in die Ecke.

Wenn man hier schaut:
http://www.chaosquake.de/lms/?m=1

Funktioniert dort das ganze im Quelltext ohne die "px" im Link.

Wieso ?

Das versteh ich nicht, weshalb ich sie setzen muss, dort aber das gleiche ohne Probleme funktioniert.

Wenn da nochmal jemand Rat wüsste... :|

[MudGuard]

Hi,

Er setzt die Punkte wenn ich aus:
Folgendes mache:

echo '<a href="?l='.$x.','.$y.'" onMouseOut="h();" onMouseOver="s(this, ''.$s.'');" class="'.$cssClass.'" style="left:'.($xRASTER_SIZE).'px; top:'.($yRASTER_SIZE).'px"></a>'."\n";

  
Du scheinst also verstanden zu haben, daß die Einheit wichtig ist.  
  

>  d.style.left= parseInt(e.style.left)+15;  
>  d.style.top= parseInt(e.style.top)+10;  
  
Oder doch nicht? Hier verwendest Du keine Einheit, wunderst Dich dann aber:  
  

> Und das Funktioniert nun wieder nicht.  
  
cu,  
Andreas

-- 
[Warum nennt sich Andreas hier MudGuard?](http://MudGuard.de/)  
[Schreinerei Waechter](http://www.schreinerei-waechter.de/)  
[O o ostern ...](http://ostereier.andreas-waechter.de/)  
Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.  

[Wolle]

Hi,

Er setzt die Punkte wenn ich aus:
Folgendes mache:

echo '<a href="?l='.$x.','.$y.'" onMouseOut="h();" onMouseOver="s(this, ''.$s.'');" class="'.$cssClass.'" style="left:'.($xRASTER_SIZE).'px; top:'.($yRASTER_SIZE).'px"></a>'."\n";

>   
> Du scheinst also verstanden zu haben, daß die Einheit wichtig ist.  
>   
> >  d.style.left= parseInt(e.style.left)+15;  
> >  d.style.top= parseInt(e.style.top)+10;  
>   
> Oder doch nicht? Hier verwendest Du keine Einheit, wunderst Dich dann aber:  
>   
> > Und das Funktioniert nun wieder nicht.  
>   
> cu,  
> Andreas  
  
Hallöle :)  
  
Dass px (scheinbar) wichtig ist, hab ich begriffen :)  
  
Änder ich:  

>  d.style.left= parseInt(e.style.left)+15;  
>  d.style.top= parseInt(e.style.top)+10;  
  
in:  
  

>  d.style.left= parseInt(e.style.left)+15px;  
>  d.style.top= parseInt(e.style.top)+10px;  
  
Bleibt dies ohne Effekt.  
Schlimmer noch, das nette OnMouseOver Fenster erscheint garnicht mehr.  
Er soll ja relativ zur Position des Punktes das OnMouseOver Event öffnen.  
  
Und zwar eben diese 15px weiter rechts und 10px tiefer.  
  
Irgendwo geht mir etwas verloren, was ich nicht seh,  
weil ich nicht weiß, dass es dahingehört :|  
  
Gruß Wolle

[Ingo Turski]

Hi,

d.style.left= parseInt(e.style.left)+15px;

was bitte soll das sein?
Du schreibst da etwas ähnliches wie var x = 10 + Bananen.
"15px" ist kein Zahl, sondern eine Zeichenkette, die mit zwei Ziffern beginnt.

freundliche Grüße
Ingo

[Wolle]

Hi,

was bitte soll das sein?
Du schreibst da etwas ähnliches wie var x = 10 + Bananen.
"15px" ist kein Zahl, sondern eine Zeichenkette, die mit zwei Ziffern beginnt.

freundliche Grüße
Ingo

Hallöle,

daher ja mein Beitrag,

dass

d.style.left= parseInt(e.style.left)+15;

nicht funktioniert.

Ich möchte ja nur draufrechnen.
Und offensichtlich stört hier schon "px" im php generierten Link.

Was eben, (http://www.chaosquake.de/lms/?m=1) ausserordentlich gut funktioniert,
nur eben bei mir nicht.

[Ingo Turski]

Hi,

d.style.left= parseInt(e.style.left)+15;

liefert eine Zahl. Daraus musst Du nur noch den erarteten CSS-String machen.

Javascript ist da ziemlich lasch, was die Typen betrifft und Dir sehr hilft.
In exakteren Programmiersprachen müsstest Du das Integer-Ergebnis in einen String umwandeln und diesen mit "px" verknüpfen. In Javascript reicht auch +"px".

freundliche Grüße
Ingo

[Wolle]

Hi,

...

In exakteren Programmiersprachen müsstest Du das Integer-Ergebnis in einen String umwandeln und diesen mit "px" verknüpfen. In Javascript reicht auch +"px".

freundliche Grüße
Ingo

Ich bin Dir zu Dank verpflichtet.
ein:

d.style.left= parseInt(e.style.left)+15+"px";

brachte den erhofften Erfolg.

So ist das, wenn man JS und CSS Jahrelang links liegen gelassen hat.

Ich danke Dir.

MfG