script läuft nicht im IE

D

deces

Guest
Hallo,

ich habe folgendes Script und Problem:

CODE <script language="javascript">
a = document.getElementById('tblTest').offsetWidth;
b = 100/a;
c = b*998;
d = 100-c;
if(d > 0){
document.write("<img src=\"{$style['imagefolder']}/banner/rtw_2.jpg\" border=\"0\" width="+d+"% height=150><img src=\"{$style['imagefolder']}/banner/rtw.jpg\"");
}
else
document.write("<img src=\"{$style['imagefolder']}/banner/rtw.jpg\"");
</script>


Im Firefox funktioniert es einwandfrei, nur im IE macht es nicht was es soll...


Ich wäre euch sehr dankbar, wenn mir jemand helen könnte
smile.gif


MfG deces
 
Ohne den HTML-Source dazu ist es etwas schwierig, das nachzuvollziehen. Ausserdem ist das wohl eher ein Mix aus PHP und Javascript: "<img src=\"{$style['imagefolder']}/. Mit dem {$style kann Javascript kaum etwas anfangen.

Hast Du mal einen Link zu der Seite, damit mans mit dem IE debuggen kann?

Griessli
Irene
 
Ja es ist ein Mix aus PHP und Javascript. Die PHP Variablen werden aber korrekt ausgegeben (sowohl im Firefox also auch im IE)...


Ich weiß mittlerweile, woran es im IE scheitert:

CODE a = document.getElementById('tblTest').offsetWidth;


wird als "0" ausgegeben.


Dabei soll die wahre größe einer Tabelle angezeigt werden, die 98% breit ist.

Der Tabellenkopf sieht folgendermaßen aus:


CODE <table border="0" cellspacing="0" cellpadding="0" id="tblTest">
 
QUOTE (deces @ So 3.9.2006, 11:09)Ich weiß mittlerweile, woran es im IE scheitert:


CODE a = document.getElementById('tblTest').offsetWidth;


wird als "0" ausgegeben.

Ein Googeln nach offsetWidth listet sofort einen SelfHtml-Beitrag zu diesem Thema mit Begründung und Code.
 
Also bei mir (IE6) funktioniert das:

CODE <html><head><title>test table width</title></head>
<body>

<p>test</p>

<table border="0" cellspacing="0" cellpadding="0" id="tblTest">
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
</tr>
<tr>
<td>eins</td>
<td>zwei</td>
<td>drei</td>
</tr>
</table>


<script language="javascript">
function test(){
var iW = document.getElementById('tblTest').offsetWidth;
alert ('breite = ' + iW); //liefert 73
}
</script>

<p><a href="" onclick="test();return false;">test</a></p>

</body>
</html>

Wenn bei Dir für die offsetWidth 0 zurückgegeben wird, muss irgendwo sonst ein Fehler versteckt sein. Finden kann man den aber wirklich nur, wenn man den gesamten Source der Seite hat.

Griessli
Irene
 
also, der code ist folgender:

CODE <table style="width:98%" border="0" cellspacing="0" cellpadding="0" id="tblTest">
<tr>
<td>

<script language="javascript">
a = document.getElementById('tblTest').offsetWidth;
b = 100/a;
c = b*998;
d = 100-c;
if(d > 0){
document.write("<img src=\"{$style['imagefolder']}/banner/rtw_2.jpg\" border=\"0\" width="+d+"% height=150><img src=\"{$style['imagefolder']}/banner/rtw.jpg\"");
}
else
document.write("<img src=\"{$style['imagefolder']}/banner/rtw.jpg\"");
</script>

border="0" alt="$master_board_name" title="$master_board_name" height=150 width=998/></a>
</td>
</tr>
</table>


Ich vermute, dass es mit dem table tag zusammenhängt, bin mir aber nicht sicher...
 
QUOTE (deces @ So 3.9.2006, 11:31)<table style="width:98%" border="0" cellspacing="0" cellpadding="0" id="tblTest">
<tr>
<td>

<script language="javascript">
a = document.getElementById('tblTest').offsetWidth;
b = 100/a;
c = b*998;
d = 100-c;
if(d > 0){
document.write("<img src=\"{$style['imagefolder']}/banner/rtw_2.jpg\" border=\"0\" width="+d+"% height=150><img src=\"{$style['imagefolder']}/banner/rtw.jpg\"");
}
else
document.write("<img src=\"{$style['imagefolder']}/banner/rtw.jpg\"");
</script>

border="0" alt="$master_board_name" title="$master_board_name" height=150 width=998/></a>
</td>
</tr>
</table>

Da sind bei nur flüchtigem Hinsehen mindestens zwei massive Fehler drin - a ist nicht geöffnet und ein document.write sollte ein ganzes Element schreiben - nicht nur den ersten Teil.

Wenn das Script nur den ersten Teil eines Elements schreibt, dann ist das Dokument nicht valide - da wird alles spätere unkalkulierbar.
 
Danke für die Antwort.

Ich habe nun das komplette Element schreiben lassen, geht aber noch nicht...


Was genau meinst du mit "a ist nicht geöffnet" ?
 
Bei mir generiert das Script keinen Fehler. Allerdings seh ich einfach ein leeres Bild, da bei mir kein PHP läuft und das Bild "file:///C:/.../{$style['imagefolder']}/banner/rtw.jpg" natürlich nicht vorhanden ist.

Aber ich würde auf jeden Fall mal das Script aus der Tabelle wegschieben. So wie es jetzt ist, ist der an den Browser gelieferte HTML-Code falsch, denn eine Tabellenstruktur darf nicht durch andere Elemente unterbrochen werden. Ausserdem kannst Du von einem Browser nicht erwarten, dass er Dir die Breite von einer 98%-Tabelle liefert zu einem Zeitpunkt, da die Tabelle gar noch nicht fertig "gezeichnet" ist.

Griessli
Irene
 
ok, klingt logisch...


Angenommen ich würde über die eigentliche tabelle eine leere tabelle mit den selben werten machen und von dieser die Breite ermitteln lassen.


Kann ich dann das Ergebnis in der "eigentlichen" Tabelle anzeigen lassen?
- In dieser Form: <img src="" width=VARIABLE>


Also:

CODE
<table style="width:98%" border="0" cellspacing="0" cellpadding="0" id="tblTest"><tr><td></td></tr></table>

<script language="javascript">
a = document.getElementById('tblTest').offsetWidth;
b = 100/a;
c = b*998;
d = 100-c;
</script>

<table style="width:98%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>

<img src="" width=d> // <------ d ist aus dem Javascript

</td>
</tr>
</table>

 
Nö das geht nicht, das HTML kann nicht auf Javascript-Variablen zugreifen. Aber wenn Du dem Bild eine ID gibst, kannst Du darauf aus dem Script zugreifen. Also keine zwei Tabellen, sondern das Script schlicht nach der Tabelle schreiben und im Script das entsprechende Bild und die Breite zuweisen. In etwa so:

CODE <table style="width:98%" border="0" cellspacing="0" cellpadding="0" id="tblTest">
<tr>
<td><img src="dummy.jpg" id="imgBanner" border="0"></td>
....
</table>

<script language="javascript">
a = document.getElementById('tblTest').offsetWidth;
b = 100/a;
c = b*998;
d = 100-c;
if(d > 0){
document.getElementById('imgBanner').src = '.../rtw_2.jpg';
document.getElementById('imgBanner').width = d%;
document.getElementById('imgBanner').height = 150;
}
else
document.getElementById('imgBanner').src = '.../rtw.jpg';
</script>

Müsstest natürlich noch etwas herumprobieren, ich weiss nicht auswendig ob das mit der Breite in % genauso geht.

Griessli
Irene
 
Zurück
Oben