Joachim: Dynamisch bis zum Gehtnichtmehr :(

Beitrag lesen

hi,

Ist es irgendwie möglich, die Breite eines Wortes (ev. durch <span> umfasst) in Pixel zu bestimmen oder den horizontalen Abstand eines Elements zum linken Fensterrand auszulesen

nun, grundsaetzlich geht sowas eher, indem Du die Breite des umgebenden Elementes herausfindest. In einem div-layer z. B., der wiederum ein span mit Text enthaelt, sollte es mit dom-faehigen Browsern etwa so gehen:

document.getElementById("divid").firstChild.offsetWidth;

Ich muss ein absolut dynamisches (*verzweifel*) Drop-Down-Menü schreiben, kann die Submenus jedoch nicht schön unter den Menüpunkt stellen.

Bist Du sicher, dass Du Deinen Ansatzpunkt nicht noch mal ueberdenken solltest? Anyway, ich habe hier noch ein Test zum Buschstabenbreite-Herausfinden rumliegen, den haenge ich mal dranne.

Gruesse  Joachim

<html>
<head>

<style type="text/css">
#ebene0 {
 position:absolute;
 width:auto;
 height:auto;
 visibility:hidden;
}
</style>

<script language="javascript1.2">
// some known objects
var nc  = !!(document.captureEvents && !document.getElementById);
var ie4   = !!(document.all    && !document.documentElement);

// einfache div-layer referenzieren
function dRef(num)  {return (nc? document.layers[num] : (ie4? document.all[num]       : document.getElementById(num)))}

//Div-Breite
function divBreit(obj)
{
    if(nc)   return obj.document.width;
    else     return obj.offsetWidth;
}

function go()
{
 var str = document.feld.eing.value;
 if(nc)
 {
  with(document.ebene0.document)
  {
   open(); write(str); close();
  }
 }
 else
 {
  dRef("ebene0").innerHTML = str;
 }

var size = divBreit(dRef("ebene0"));
 document.feld.eing.value = size;
}
</script>

</head>

<body marginheight="0" marginwidth="0">
<form Name="feld">
    <input type="text" name="eing" size="10">
    <input type="button" value="Buchstabenbreite" onclick="go()">
</form>
<div id="ebene0">Erstes Div</div>

</body>
</html>