Probleme mit Firefox "Bilder einfliegen"
Philipp K.
- javascript
0 derletztekick0 Philipp K.0
MudGuard
Hallo, ich habe folgendes Problem:
Ich habe folgendes klein Script geschrieben:
<script type="text/javascript">
Position = document.getElementById("bild").offsetLeft;
function Bewegen() {
if (Position != 0) {
Position = Position + 5;
document.getElementById("bild").style.left = Position;
}
window.setTimeout("Bewegen()", 10);
}
Bewegen();
</script>
Das ganze gehört zu einem DIV Tag (eigentlich davor):
<div id=bild style="position:absolute; top:35px; left:0px; width:402px" class="imgtext">
<img style="border-width:2px; border-style:solid; border-color:#000000;" alt="Titel" title="Titel" src="Pro/w1/s4.jpg"/><br>Bildbeschriftung</div>
Funktioniert im IE so wie gewünscht (Bild kommt von links eingeschoben)
Im FireFox sehe ich erst nur einen kleinen Streifen und dann auf einmal das ganze Bild, d.h. die Anzeige wird während der Zwischenstufen nicht aktuallisiert. Das ganze passiert auch wenn ich die Zeit ewig lang mache oder die Funktion manuell über nen Link aufrufe. Das Bild wird erst neu gezeichnet wenn es voll dargestellt werden kann?!?
Danke für evtl. Ideen
Philipp
Hallo Philipp K.,
Im FireFox sehe ich erst nur einen kleinen Streifen und dann auf einmal das ganze Bild
Das glaube ich nicht, Du solltest gar nichts sehen, da nichts passiert
if (Position != 0)
Du fragst in Deiner Funktion die aktuelle Position ab, wenn diese ungleich Null ist, so verschiebe um 5 (Pixel nehme ich mal an). Wie soll da jemals etwas passieren: style="position:absolute; top:35px; left:0px;, wenn es zu Beginn schon Null ist?
Wenn Du in JS CSS Angaben setzt, dann unterliegen diese den selben Regeln wie auch bei reinem CSS. Du musst Einheiten verwenden:
document.getElementById("bild").style.left = Position + "px";
Deinem Script fehlt auch eine vernünftige Abbruchbedingung. Sollte es wirklich einmal laufen (zB mit einem Startwert von left:1px; fürs DIV), dann läuft das Bild ins Unendliche nach rechts...
Mit freundlichem Gruß
Micha
Hallo Micha,
danke für deine Nachhilfe!
Im endeffekt war's das "+ "px"" was gefehlt hat.
Ich habe das mit dem left:0px gemacht, damit auch Besucher ohne Javascript das Bild sehen.
In meiner Frage habe ich vergessen die Zeile mit anzugeben, die das Bild erst mal aus dem Anzeigebereich schiebt (habe einfach gestern Abend zu viel am Code rum gefuhrwerkt).
Was mich so wahnsinnig gemacht hat ist die Tatsache, dass der Firefox nach Ende der Schleife das Bild dann an der Endposition angezeigt hat. Deshalb habe ich nicht nach nem Fehler bei der Positionsangabe gesucht.
VIELEN DANK!!!
Hier das Script fall's es jemand haben will...
<div id=bild style="position:absolute; top:35px; left:0px; width:402px" class="imgtext">
<img style="border-width:2px; border-style:solid; border-color:#000000;" alt="Titel" title="Titel" src="bild1.jpg"/>
<br>Bildbeschriftung
</div>
<script type="text/javascript">
Position = -420; //Startposition des Bildes
document.getElementById("bild").style.left = Position + "px";
function Bewegen() {
if (Position < 0) {
Position = Position + 15; //Pixel pro Aufruf
document.getElementById("bild").style.left = Position + "px";
}
window.setTimeout("Bewegen()", 15); //Aufruf alle XXms
}
Bewegen();
</script>
Hi,
Was mich so wahnsinnig gemacht hat ist die Tatsache, dass der Firefox nach Ende der Schleife das Bild dann an der Endposition angezeigt hat.
Klar, bei einem Längenwert von 0 darf die Einheit ja auch fehlen ...
cu,
Andreas
Ok, ist irgendwie logisch (Ich hasse es wenn man sich Stunden mit zwei Buchstben beschäftigt (px)...).
Schade nur das in der JavaScript Console des FireFox nix auftaucht wie Z.B. "Ungültiger Wert"
Gute Nacht und nochmal Danke!
Hallo Philpp K.,
Schade nur das in der JavaScript Console des FireFox nix auftaucht wie Z.B. "Ungültiger Wert"
tut es doch, zumindest bei mir.
Meine meldet:
"Fehler: Fehler beim Verarbeiten des Wertes für Eigenschaft 'left'. Deklaration ignoriert.
Quelldatei: file:///C:/test.html
Zeile: 0"
Mit freundlichem Gruß
Micha