nicht angemeldet
Position eines div herausfinden
Sers zusammen,
Ich habe einen Div der mit Center in der Browsermitte hängt.
Wie bekomme ich hier heraus wie weit links er hängt.
Ich habe bis jetzt lediglich folgendes gefunden - dies funktioniert aber nur wenn Left explizit angegeben wurde:
document.getElementById('centerdiv').style.left
Kann mir jemand helfen - bzw veilleicht ein workarount sagen ?
Danke schonmal
Thonix
-
Hallo,
posLeft = document.getElementById('centerdiv').offsetLeft;
bzw. offsetTop sollte m.W. in allen neueren Browsern funktionieren.
Gruß, Jan
-
Komischweise bekomme ich aber immer bei document.getElementById('centerdiv').offsetLeft; die Zahl 10 (IE 6) und beim Firefox die Zahl 8 egal wie groß das fenster ist.
was soll das bedeuten ?-
Hallo,
Komischweise bekomme ich aber immer bei document.getElementById('centerdiv').offsetLeft; die Zahl 10 (IE 6) und beim Firefox die Zahl 8 egal wie groß das fenster ist.
Wenn ich deine Aussage im Ausgansposting
Ich habe einen Div der mit Center in der Browsermitte hängt.
richtig verstehe, hast du also sowas gemacht wie:
<div align="center">...</div>
Damit hättest du dann nicht das div zentriert, sondern dessen Inhalt
zentriert ausgerichtet. Das 'offsetLeft' gibt dir jetzt den linken
Standardabstand zurück, den dieses div vom Anzeigebereich des Browsers
hat. Das werden bei IE eben 10 und bei Mozilla 8 Pixel sein. Gib dem div
mit<div align="center" style="border: 1px black solid;">...</div>
einen Rahmen, dann siehst du es.
Wenn du ein div mit einer festen Breite wirklich zentrieren willst,
mach z.B. mal folgendes:<div style="margin: 0 auto; width: 500px; border: 1px black solid;>...</div>
Dann sollte dir klar werden wie das mit dem 'offsetLeft' funktioniert.
Gruß, Jan
-
Ok das geht - Danek schon mal
Wie shieht das ganze aus wenn das in einer Tabelle abgeht
z.B.
<table width="100%" border="1"><tr>
<td></td><td width="500px">
<div id="home" style="border: 1px black solid; margin: 0 auto; width:
500px;" >
TETS
</div>
</td><td></td>
</tr></table>
-
-
-
-
Hallo.
Kann mir jemand helfen - bzw veilleicht ein workarount sagen ?
Du müsstest erst mal die Fenstergröße herausfinden.
Diese geteilt durch 2.
Dann müsstest du noch die Wortgröße kennen und diese ebenfalls durch 2 teilen.
Dann das erste Ergebnis minus das zweite und fertig.Verstanden was ich meine?
Also die verfügbare Fenstergröße erkennst du so:
document.body.clientWidth
[kein Link zu SELFHTML vorhanden]Die Wortgröße erkennst du so:
document.getElementById("x").offsetWidth
http://de.selfhtml.org/javascript/objekte/all.htm#offset_widthHier habe ich mal einen kleinen Beispiel-Code gemacht:
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
<html>
<head>
<title>Position herausfinden</title>
</head>
<body><span id="x" style="position:absolute; left:10px;">wasdfww</span>
<!-- hier drüber ist der angezeigte Text -->
<script type="text/javascript">
<!--
var n = document.getElementById("x").offsetWidth; // Breite des Textes
var l = eval(document.body.clientWidth + "/ 2" + "-" + n + "/ 2");
// hier ist die Rechnerei die ich eben erklärt habedocument.getElementById("x").style.left = l;
// hier wird die Entfernung von link bestimmt//-->
</script></body>
</html>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
Solltest du noch Fragen dazu haben kannst du diese gerne stellen.
Das ist doch so in ungefähr das, was du meintest, oder?Ich hoffe ich konnte helfen, H2O
--
Erst die FAQ's durchgehen: http://de.selfhtml.org/navigation/faq.htm.
Dann im im </archiv/> suchen: http://suche.de.selfhtml.org/
http://www.google.de/ nutzen und erst dann das Forum fragen.
ie:% fl:| br:^ va:| ls:# fo:) rl:? n4:| ss:{ de:] js:) ch:? sh:( mo:? zu:|
Infos: http://emmanuel.dammerer.at/selfcode.html-
Hier habe ich mal einen kleinen Beispiel-Code gemacht:
ma labgesehen, das das ziemlich Umständlich ist.
var l = eval(document.body.clientWidth + "/ 2" + "-" + n + "/ 2");
// hier ist die Rechnerei die ich eben erklärt habeWarum eval?
eval ist lediglich notwendig, wenn du zur Laufzeit dynamischen code ausführen willst, z.b. wenn du eine Eingabe vom User ausführen willst. Ansonsten ist eval überflüssig und schädlich.document.getElementById("x").style.left = l;
aktuelle Browser erwarten hier immer eine Einheit.
Struppi.
-
Hallo.
ma labgesehen, das das ziemlich Umständlich ist.
Aber so lässt es sich gut zeigen.
Warum eval?
eval ist lediglich notwendig, wenn du zur Laufzeit dynamischen code ausführen willst, z.b. wenn du eine Eingabe vom User ausführen willst. Ansonsten ist eval überflüssig und schädlich.Was sollte man denn ansonsten für Berechnungen nehmen?
Soll ich dafür parseInt() nehmen?
Ich dachte eval() ist OK für Berechnungen, da SELFHTML auch Berechnungen als Beispiel dafür nimmt.Aber warum ist eval() denn schädlich?
aktuelle Browser erwarten hier immer eine Einheit.
Oh, ja. *stirnaufdentischhauend* Habe ich ganz vergessen.
Das muss natürlich l + "px" heißen.
Sorry.Vielen Dank für die Korrektur, H2O
--
Erst die FAQ's durchgehen: http://de.selfhtml.org/navigation/faq.htm.
Dann im im </archiv/> suchen: http://suche.de.selfhtml.org/
http://www.google.de/ nutzen und erst dann das Forum fragen.
ie:% fl:| br:^ va:| ls:# fo:) rl:? n4:| ss:{ de:] js:) ch:? sh:( mo:? zu:|
Infos: http://emmanuel.dammerer.at/selfcode.html-
ma labgesehen, das das ziemlich Umständlich ist.
Aber so lässt es sich gut zeigen.
naja was spricht gegen offsetLEft/Top?
Warum eval?
eval ist lediglich notwendig, wenn du zur Laufzeit dynamischen code ausführen willst, z.b. wenn du eine Eingabe vom User ausführen willst. Ansonsten ist eval überflüssig und schädlich.Was sollte man denn ansonsten für Berechnungen nehmen?
??? Du benzutzt doch schon alles +-/*
Soll ich dafür parseInt() nehmen?
Das ist dazu da um eine Fließkommazahl in eine integer Zahl umzuwandeln.
Ich dachte eval() ist OK für Berechnungen, da SELFHTML auch Berechnungen als Beispiel dafür nimmt.
Nein, tut selfhtml eben nicht.
Es wird eine Benutzereingabe berechnet. d.h. der Benutzer muss JS Code eingeben und dieser wird dann zur Laufzeit ausgeführt.Aber warum ist eval() denn schädlich?
Es ist langsam, du findest keinen Fehler in eval, es gibt Browser die zum Absturz neigen und es ist ist schlicht und einfach überflüssig.
Struppi.
-
Hallo.
naja was spricht gegen offsetLEft/Top?
Nix. Ich bin eben nur nicht drauf gekommen *g*
??? Du benzutzt doch schon alles +-/*
Wenn man aber eine Berechnung mit + durchführt verbindet JS nur die Strings und es wird keine Rechnung durchgeführt.
Ich dachte eval() ist OK für Berechnungen, da SELFHTML auch Berechnungen als Beispiel dafür nimmt.
Nein, tut selfhtml eben nicht.Natürlich.
Es wird eine Benutzereingabe berechnet. d.h. der Benutzer muss JS Code eingeben und dieser wird dann zur Laufzeit ausgeführt.
Aber das ist doch eine Berechnung.
Und außerdem steht auf dem Button von SELFHTML sogar "Berechnen".Es ist langsam, du findest keinen Fehler in eval, es gibt Browser die zum Absturz neigen und es ist ist schlicht und einfach überflüssig.
Danke für die Info.
Schönen Tag noch, H2O
--
Erst die FAQ's durchgehen: http://de.selfhtml.org/navigation/faq.htm.
Dann im im </archiv/> suchen: http://suche.de.selfhtml.org/
http://www.google.de/ nutzen und erst dann das Forum fragen.
ie:% fl:| br:^ va:| ls:# fo:) rl:? n4:| ss:{ de:] js:) ch:? sh:( mo:? zu:|
Infos: http://emmanuel.dammerer.at/selfcode.html-
Wenn man aber eine Berechnung mit + durchführt verbindet JS nur die Strings und es wird keine Rechnung durchgeführt.
In dem Falle musst du die Datentypen anpassen, d.h. entweder mit parseInt oder parseFloat arbeiten, oder einfach den Wert mit 1 multiplizieren, dann wird automatisch der Typ angepaßt.
Ich dachte eval() ist OK für Berechnungen, da SELFHTML auch Berechnungen als Beispiel dafür nimmt.
Nein, tut selfhtml eben nicht.Natürlich.
Nein.
Es wird eine Benutzereingabe berechnet. d.h. der Benutzer muss JS Code eingeben und dieser wird dann zur Laufzeit ausgeführt.
Aber das ist doch eine Berechnung.
Nein ist es nicht. Du kannst gibt JS Code ein, der eine Berechnung darstellt, aber du kannst genauso gut "alert('1')" eingeben
Und außerdem steht auf dem Button von SELFHTML sogar "Berechnen".
Ist alert('1') eine Berechnung?
einer der wenigen Verwendungszwecke von eval, ist User eingaben zur Laufzeit auszuführen (was man aber vermeiden sollte). eval führt JS Code aus keine Berechungen (aber natürlich kannst du JS Code eingeben der Berechnungen durchführt).
Struppi.
-
Hallo.
In dem Falle musst du die Datentypen anpassen, d.h. entweder mit parseInt oder parseFloat arbeiten, oder einfach den Wert mit 1 multiplizieren, dann wird automatisch der Typ angepaßt.
Wie meinst du das?
(x+ y)*1 ?
Kann ich eigentlich auch x -(-y) benutzen? Das funktioniert nähmlich.Nein.
Jain *g*
Nein ist es nicht. Du kannst gibt JS Code ein, der eine Berechnung darstellt, aber du kannst genauso gut "alert('1')" eingeben
Ist alert('1') eine Berechnung?Gegenfrage: Ist 1+2 denn keine Berechnung?
Ich denke mal, dass SELFHTML beides als möglich sieht.
Zitat (link:http://de.selfhtml.org/javascript/objekte/unabhaengig.htm#eval]:
"Wenn das übergebene Argument als Objekt oder Objekteigenschaft interpretiert werden kann, wird das Objekt bzw. die Objekteigenschaft zurückgegeben."Wenn also etwas wie "alert('1')" eingegeben wird, wird es also ausgeführt bei anderem wird einfach versucht die Eingabe umzuwandeln.
So verstehe ich zumindest diesen Satz.einer der wenigen Verwendungszwecke von eval, ist User eingaben zur Laufzeit auszuführen (was man aber vermeiden sollte). eval führt JS Code aus keine Berechungen (aber natürlich kannst du JS Code eingeben der Berechnungen durchführt).
"1+2" ist aber kein JS-Code und rechnet eval() es aus.
Schönen Tag noch, H2O
--
Erst die FAQ's durchgehen: http://de.selfhtml.org/navigation/faq.htm.
Dann im im </archiv/> suchen: http://suche.de.selfhtml.org/
http://www.google.de/ nutzen und erst dann das Forum fragen.
ie:% fl:| br:^ va:| ls:# fo:) rl:? n4:| ss:{ de:] js:) ch:? sh:( mo:? zu:|
Infos: http://emmanuel.dammerer.at/selfcode.html-
In dem Falle musst du die Datentypen anpassen, d.h. entweder mit parseInt oder parseFloat arbeiten, oder einfach den Wert mit 1 multiplizieren, dann wird automatisch der Typ angepaßt.
Wie meinst du das?
(x+ y)*1 ?
Kann ich eigentlich auch x -(-y) benutzen? Das funktioniert nähmlich.Ja, ist wahrscheinlich sogar schneller.
Nein ist es nicht. Du kannst gibt JS Code ein, der eine Berechnung darstellt, aber du kannst genauso gut "alert('1')" eingeben
Ist alert('1') eine Berechnung?Gegenfrage: Ist 1+2 denn keine Berechnung?
Klar und es ist JS Code.
Wenn also etwas wie "alert('1')" eingegeben wird, wird es also ausgeführt bei anderem wird einfach versucht die Eingabe umzuwandeln.
So verstehe ich zumindest diesen Satz.Nein, es wird einfach der JS Code ausgeführt 1 + 2 ist JS Code
"1+2" ist aber kein JS-Code und rechnet eval() es aus.
Doch es ist JS code.
alert('1+2') -> gibt '1+2' aus
alert(eval('1+2')) -> führt '1+2' aus und gibt das Ergebniss zurück
alert(('alert("1"')) -> gibt "alert("1")" aus
alert(eval('alert("1"')) -> gibt "1" aus und undefined (der Rückgabewert von alert('1')).Und selbst wenn es so gewesen wäre wie du es dachtest, was sollte der Vorteil von:
x = eval('1+2');
gegenüber:
x = 1 + 2;
sein?
und wenn du dir den Zeitaufwand mal ausgeben läßt:
var t1, t2;c = 10000;
alert("Start ohne eval()");
t1 = new Date();
while( c--)var x = 1 + 2;
t2 = new Date();alert('Zeit:' + (t2 - t1) );
c = 10000;
alert("Start eval()");
t1 = new Date();
while( c--)var x = eval('1 + 2');
t2 = new Date();
alert('Zeit:' + (t2 - t1) );es ist bei mir ca. zehnmal so langsam.
Struppi.
-
Hallo.
Ja, ist wahrscheinlich sogar schneller.
Du meinst x -(-y) ?
Klar und es ist JS Code.
Nein, es wird einfach der JS Code ausgeführt 1 + 2 ist JS Code1+2 soll JS-Code sein?
Ich würde es ehr Aufgabe nennen.Doch es ist JS code.
Sicher?
Und selbst wenn es so gewesen wäre wie du es dachtest, was sollte der Vorteil von:
x = eval('1+2');
gegenüber:
x = 1 + 2;
sein?1 + 2 = 12 (für JS)
eval("1+2") = 3Schönen Tag noch, H2O
--
Erst die FAQ's durchgehen: http://de.selfhtml.org/navigation/faq.htm.
Dann im im </archiv/> suchen: http://suche.de.selfhtml.org/
http://www.google.de/ nutzen und erst dann das Forum fragen.
ie:% fl:| br:^ va:| ls:# fo:) rl:? n4:| ss:{ de:] js:) ch:? sh:( mo:? zu:|
Infos: http://emmanuel.dammerer.at/selfcode.html-
Klar und es ist JS Code.
Nein, es wird einfach der JS Code ausgeführt 1 + 2 ist JS Code1+2 soll JS-Code sein?
Ich würde es ehr Aufgabe nennen.Nein, wenn es kein JS Code würde es nicht ausgeführt werden.
Doch es ist JS code.
Sicher?
Ja.
Und selbst wenn es so gewesen wäre wie du es dachtest, was sollte der Vorteil von:
x = eval('1+2');
gegenüber:
x = 1 + 2;
sein?1 + 2 = 12 (für JS)
nein, 1 + 2 ist auch in JS 3. Nur wenn entweder eine Zahl ein String ist oder das Ergebnis ein String sein muss dann wird es 12.
alert(eval(1+2));
alert(1 + 2);ergibt bei mir zweimal 3.
eval("1+2") = 3
alert(eval("1+'2'"));
alert(1 + '2');ergibt bei mir zweimal '12'. Es spielt keine Rolle ob du mit eval JS ausführst oder ohne (bis auf die erwähnten Nachteile).
Schönen Tag noch, H2O
Struppi.
-
Hallo.
Nein, wenn es kein JS Code würde es nicht ausgeführt werden.
Sicher?
Ja.OK. Dann ist es eben JS-Code. Stimmt deine obrige Erklärung leuchtet mir ein.
nein, 1 + 2 ist auch in JS 3. Nur wenn entweder eine Zahl ein String ist oder das Ergebnis ein String sein muss dann wird es 12.
ergibt bei mir zweimal '12'. Es spielt keine Rolle ob du mit eval JS ausführst oder ohne (bis auf die erwähnten Nachteile).OK, OK. Ich sehe es ja ein.
Wenn man es als String ausführt ist es 12, aber ganz normal ist es 3.Es war nett sich darüber zu unterhalten, H2O
--
Erst die FAQ's durchgehen: http://de.selfhtml.org/navigation/faq.htm.
Dann im im </archiv/> suchen: http://suche.de.selfhtml.org/
http://www.google.de/ nutzen und erst dann das Forum fragen.
ie:% fl:| br:^ va:| ls:# fo:) rl:? n4:| ss:{ de:] js:) ch:? sh:( mo:? zu:|
Infos: http://emmanuel.dammerer.at/selfcode.html
-
-
-
-
-
-
-
-
-
-