jQuery: An- und Ausschalter programmieren mit einer Variablen Programmieren?

... komplette Frage anzeigen

4 Antworten

Simpel.. beim hover rufst du am besten eine funktion auf die deinen gewünschten effekt auslöst. in diese funnktion baust du allerdings ala allererstes die abfrageeein ob die public var "schalter" -insofern du diese als bool benutzt- true ist. nur wenn ja löst du dann deinen effekt aus. den schalter aus oder ein schalten kannst du über ne andere funktion und onclick methode (y)

Antwort bewerten Vielen Dank für Deine Bewertung

Viel einfacher:

Gib dem bild eine x-belibige klasse nennen wir sie ".unwichtig" (diese ist für den weiteren verlauf eigendlich unwichtig).
Mit dem schalter (on click) toggelst (hinzufügen/entfernen) du eine weitere klasse des bildes, nenne sie ".wichtig". Dein hover effekt legst du auf die klasse .wichtig ( .wichtig:hover{...} ). Mit der klasse ".unwichtig" kannst du eigenschaften für das Bild festlegen welche für beide Zustände gleich sind.

Antwort bewerten Vielen Dank für Deine Bewertung

Würde mit .hover und .leave die verschiedenen Bilder einspeisen und das Ganze in ein if else einbinden.

Was meinen die Anderen, würde das klappen?

Antwort bewerten Vielen Dank für Deine Bewertung

Die Variable schalter sollte ein boolscher Ausdruck sein (true oder false), der angibt, ob der Schalter ein (true) oder aus (false) ist.

Beim Klick auf irgendein Objekt (vermutlich ein Bild) mit der Klasse "schalter" änderst du dann die Variable schalter auf entweder true oder false (je nachdem, was es vorher war). Außerdem ändert sich das Bild auf "schalterein.png".

Dann fügst du beim Bild (hier mit der Klasse "image") noch einen hover Handler hinzu, der Funktionen beim mouse-enter und mouse-leave ausführt.

Wenn ihr noch ein Bild für den ausgeschalteten Schalter habt (geht nicht aus der Angabe hervor), dann musst du das beim Klick auf "schalter" noch einbauen.


var schalter = false;

$("#schalter").click(
function() {
schalter = !schalter;
$("#schalter").attr("src", "schalterein.png");
}
);

$("#image").hover(
function() {
if (schalter) {
$("#image").attr("src", "bild2.png");
}
},
function() {
if (schalter) {
$("#image").attr("src", "bild1.png");
}
}
);



Antwort bewerten Vielen Dank für Deine Bewertung

Was möchtest Du wissen?