Problem mit Bildwechsel-Script
Paco
- javascript
Hallo!
Vorweg entschuldigung für die wahrscheinlich sehr ungenaue Fragestellung, aber ich weiß gerade nicht wie ichs besser ausdrücken soll.
Hab ein Script gebastelt (bzw geklaut) dass mir bei onclick auf eine Grafik ein input-Feld zwischen 'readonly' und 'nicht readonly' hin und herswitcht. Funktioniert auch prima. Jetzt wollte ich das grafisch unterstützen mit einem offenen und einem geschlossenen Schloss neben dem inputfeld, dass ebenfalls beim onclick switcht.
Funktioniert auch. ABER: leider nicht auf der seite wo ichs einbauen will. Da wird bei onclick die auszutauschende Grafik verzerrt am Seitenanfang dargestellt und ersetzt nicht die alte.
Hier mal der Code für den Bildwechsel:
var bild = new Array();
bild[0] = new Image();
bild[0].src = "img/locked.gif";
bild[1] = new Image();
bild[1].src = "img/unlocked.gif";
var n = 0;
function bildwechsel2 (zahl) {
if (n == 1) {
document.images[zahl].src = bild[0].src;
n--; }
else {
document.images[zahl].src = bild[1].src;
n++; }
}
In der Seite eingebunden mittels:~~~html
<img src="img/locked.gif" onclick="bildwechsel2(0)">
Wie gesagt, auf einer Seite funktionierts prima auf der anderen erscheint nach dem klick das geöffnete Schloss verzerrt am Seitenanfang.
Ich weiß, ihr habt keine Kristallkugel und so, aber ich wär für jeden Denkanstoss dankbar. Was kann das sein? Hab ja schon fast alles ausgeschlossen, das Ding aus dem <form>-tag rausgeholt, als link und nicht als link, den anderen javascript-kram weggelassen, doctypes verglichen...
Das script kommt auch aus der gleichen inkludierten Datei.
Bin ratlos...
danke Paco
Mahlzeit Paco,
Wie gesagt, auf einer Seite funktionierts prima auf der anderen erscheint nach dem klick das geöffnete Schloss verzerrt am Seitenanfang.
Dann ist vielleicht auf der einen Seite das zu ändernde Bild <http://de.selfhtml.org/javascript/objekte/images.htm@title=das erste auf der Seite> und auf der anderen ist es das nicht ...
MfG,
EKKi
Dann ist vielleicht auf der einen Seite das zu ändernde Bild <http://de.selfhtml.org/javascript/objekte/images.htm@title=das erste auf der Seite> und auf der anderen ist es das nicht ...
Oh mein Gott. Du hast natürlich recht. Das kommt davon, wenn man Code benutzt den man nicht selber geschrieben (oder..hüstel..verstanden) hat. Javascript und ich ist allerdings auch nicht gerade Liebe auf den ersten Blick ;-)
Vielen Dank Ekki, Problem gelöst und was dazugelernt.
Bis bald
paco
Meine Glaskugel orakelt gerade, dass im anderen Dokument noch ein weiteres Bild ist, welches Du nicht mitgezählt hast.
Statt der Nummer des Bildes solltest Du lieber das <img>-Node selbst an die Funktion übergeben - das geht so:
HTML: <img src="locked.gif" onclick="bildwechsel(this);" />
JS:
var imgsrc = [ (new Image()).src = 'locked.gif', (new Image()).src = 'unlocked.gif' ];
function bildwechsel(img) {
img.status = !img.status;
img.src = imgsrc[img.status ? 0 : 1];
}
In diesem Code stecken gleich ein paar Tricks: der erste besteht darin, in der Erzeugung des Arrays die Bilder vorzuladen. Der zweite besteht in der Verwendung einer Objekt-Instanz zum Speichern des Status. Der dritte besteht in der Verwendung des Not-Operators zur Auswertung des Status.
Gruß, LX