mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: So 04.12.2016 05:24 Benutzername: Passwort: Auto-Login

Thema: JS: mit onClick 2 Grafiken gleichz. austauschen. Wie? vom 17.05.2004


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> JS: mit onClick 2 Grafiken gleichz. austauschen. Wie?
Autor Nachricht
mcbethy
Threadersteller

Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 33
Geschlecht: Weiblich
Verfasst Mo 17.05.2004 15:13
Titel

JS: mit onClick 2 Grafiken gleichz. austauschen. Wie?

Antworten mit Zitat Zum Seitenanfang

Es ist mal wieder so weit! Ich brauche eure Hilfe.
Ich bin gerade dabei einer Navigation etwas Leben einzuhauchen.

Mal ein Beispiel:
Ich habe den Button "Markt" mit dem Namen "markt_". Die Schrift ist grau.
Beim Mouseover wird die Schrift rot, beim Mouseout wird das Bild in seinen Normalzustand gesetzt.
Und klar: onClick ist dann wieder der Button mit roter Schrift.

Etwas weiter unten in der Seite soll ebenfalls ein Bild ausgetauscht werden, wenn man auf "Markt" klickt.
Dieses Bild soll so lange unangetastet bleiben, bis ein anderer Menüpunkt angeklickt wird.
Wie schaffe ich es, 2 Bilder gleichzeitig anzusprechen?

Zur Veranschaulichung hier einmal das Script:
Code:
if (navigator.appVersion.indexOf("2.") != -1){
        check = false;
        }
if ((navigator.appVersion.indexOf("3.") != -1) && (navigator.appName.indexOf("Explorer") != -1)){
        check = false;
        }
else {
        check = true;
        }
if (check == true){

   markt_ = new Image(); markt_.src = "images/bu/markt.gif";
   markt_on = new Image(); markt_on.src = "images/bu/markt_hi.gif";
   markt_stay = new Image(); markt_stay.src = "images/bu/markt_hi.gif";
   
}

imageStay = ""

function imageon(name){
        if (imageStay != name){
                document[name].src = eval(name + "on.src");
        }
}
function imageoff(name){
        if (imageStay != name){
                document[name].src = eval(name + ".src");
        }
}
function stay(name){
        if (check == true){
        document[name].src = eval(name + "stay.src");
        if (imageStay != name){
                if (imageStay != ""){
                        document[imageStay].src = eval(imageStay + ".src");
                }
        }
        imageStay = name
        }
}

Und hier der Button mit dem Script:
Code:
<a href="#" onMouseover="imageon('markt_')" onMouseout="imageoff('markt_')" onClick="stay('markt_')";><img src="images/bu/markt.gif" name="markt_" width="71" height="12" border="0"></a>

Ich wäre euch echt dankbar, wenn ihr einen Lösungsansatz dazu hättet.

Danke im Voraus!


Zuletzt bearbeitet von mcbethy am Mo 17.05.2004 15:14, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
tuxedo

Dabei seit: 10.10.2002
Ort: ~/
Alter: 44
Geschlecht: -
Verfasst Mo 17.05.2004 16:16
Titel

Antworten mit Zitat Zum Seitenanfang

hab da mal vor n paar wochen n script geschrieben und grad was erweitert:
click


so in etwa?


//stör dich nicht an diesem ballast im qt, kommt alles von diesen lycos-spinnern

hier mal der etwas überarbeitete qt:
Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" href="check.css" type="text/css">
<title>clicked,over and out...</title>
<script language="JavaScript">
normalContainer = new Array ("../gfx/button1normal.gif","../gfx/button2normal.gif","../gfx/button2normal.gif");
overContainer = new Array ("../gfx/button1over.gif","../gfx/button2over.gif","../gfx/button2over.gif");
clickedContainer = new Array ("../gfx/button1clicked.gif","../gfx/button2clicked.gif","../gfx/button3clicked.gif");
changeContainer = new Array ("../gfx/button1over.gif","../gfx/button1clicked.gif","../gfx/button2normal.gif");

imageContainer = new Array ();
var imageCount = normalContainer.length;
var imagePraefix = "image_";
for (i=0;i<imageCount;i++){
   imageContainer[i] = new Object();
   imageContainer[i].normal = normalContainer [i]
   imageContainer[i].over = overContainer [i]
   imageContainer[i].clicked = clickedContainer [i]
   imageContainer[i].clickCheck = false;
}
function imageManager (direction,target,changeTo,overText) {
   var number = target.slice (imagePraefix.length);
   if (overText == undefined){
      overText = "nicht vorhanden";
   }
   if (!imageContainer[number].clickCheck){
      if (direction == "over"){
         document.images[target].src = imageContainer[number].over;
         document.images[target].alt = overText
      } else if (direction == "out"){
         document.images[target].src = imageContainer[number].normal;
      } else if (direction == "click"){
         for (i=0;i<imageCount;i++){
            resetImage = imagePraefix + i;
            document.images[resetImage].src = imageContainer[i].normal;
            imageContainer[i].clickCheck = false;
         }      
         document.images[target].src = imageContainer[number].clicked;
         document.images["changeOnce"].src = changeContainer[changeTo];
         imageContainer[number].clickCheck = true;
      }
   }
}
//-->
</script>
</head>
<body bgcolor="#333333">
<a href="#" onClick="imageManager('click','image_0','0');" onMouseOver="imageManager('over','image_0','','over1');" onMouseOut="imageManager('out','image_0');"><img src="../gfx/button1normal.gif" width="120" height="40" border="0" name="image_0"></a><br>
<a href="#" onClick="imageManager('click','image_1','1');" onMouseOver="imageManager('over','image_1','','over2');" onMouseOut="imageManager('out','image_1');"><img src="../gfx/button2normal.gif" width="120" height="40" border="0" name="image_1"></a><br>
<a href="#" onClick="imageManager('click','image_2','2');" onMouseOver="imageManager('over','image_2','','over3');" onMouseOut="imageManager('out','image_2');"><img src="../gfx/button3normal.gif" width="120" height="40" border="0" name="image_2"></a><br>
<br><br><br>
<img src="../gfx/button3normal.gif" width="120" height="40" border="0" name="changeOnce"><br>
</body>
</html>



ist "fast" selbsterklärend...

gruss
tux
  View user's profile Private Nachricht senden
Anzeige
Anzeige
mcbethy
Threadersteller

Dabei seit: 02.12.2002
Ort: Hamburg
Alter: 33
Geschlecht: Weiblich
Verfasst Mo 17.05.2004 16:41
Titel

Antworten mit Zitat Zum Seitenanfang

Vielen Dank erst einmal.

*schluck* O-wei, das sieht ja nun ganz anders aus als das meine.
Kann meines nicht entsprechend erweitert werden? Irgendwie fehlt mir da das logische Denken, glaub ich.
  View user's profile Private Nachricht senden
 
Ähnliche Themen [Javascript] Mouseover-mehrere Grafiken austauschen
onclick-Event bei onclick dieses Elements ändern
onclick funktion
Zufallsbild mit Onclick...
onClick Handler
play movie onclick?
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.