• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Rollover-Effekt auf 2 Bildern, aber wie?

Status
Für weitere Antworten geschlossen.
S

snyper27

Neues Mitglied
Hallo!

Ich habe folgendes problem beim erstellen eines Rolloverbildes...
1. Ich möchte auf meine Seite sozusagen eine Rollover-Bildergalerie erstellen doch besitze ich relativ wenig html-kenntnisse.

Also ich möche es so machen:
_____________________________________________

BILD

bild1,bild2,bild3,bild4,bild5
_____________________________________________

das großgeschriebene BILD, soll ein Bild sein, das in einer größeren Ansicht dargestellt wird, es soll also das Bild sein, dass man sich gerade anschauen möchte.

bild1,2,3,4 und 5 sind Kleinformate andere bilder.

Und der Rollover-Effekt soll folgender sein:
Beim "drüberfahren" über die kleinen Bilder soll das große BILD sich je nach ausgewähltem Bilde anpassen sodass ohne jegliche Klicks jedes der Bilder schnell angeschaut werden kann.

Ich danke schonmal im vorraus für jede Antwort!

Gruß Snyper27
 
Werbung:
Danke für die Antwort doch ich dachte eher an eine Lösung die so aussieht:

Großes Bild

kleines Bild | kleines Bild | kleines Bild

so.. wenn man nun über eines der kleinen kommt dann sollte dieses vergrößert an die Stelle des großen Bildes. Wahrscheinlich dürfte das eine komplexere Lösung sein doch so stell ich mirs eigentlich vor.

Würde mich über weitere Hilfe sehr freuen :)
 
Werbung:
Hallo
ich hab dir mal dieses Script geschrieben:
HTML: 
<html>
<head>
<title>
Bilder anschauen
</title>
<script type="text/javascript">
function gross(bildname) {
    if(document.getElementById('grossesBild').src.indexOf(document.getElementById(bildname).src) == -1) {
        document.getElementById('grossesBild').src = document.getElementById(bildname).src;
    }
}
</script>
</head>
<body>
<img src="Forest.jpg" alt="Großansicht" id="grossesBild" height="600" />
<br />
<img src="Forest.jpg" id="bild1" onmouseover="gross('bild1')" height="100" />
<img src="prärie.jpg" id="bild2" onmouseover="gross('bild2')" height="100" />
<img src="Waterfall.jpg" id="bild3" onmouseover="gross('bild3')" height="100" />
</body>
</html>
Ist zwar noch kein valides HTML und du musst es eben in deine Seite einbauen. Allerdings musst du bedenken, dass diese JS-Lösung bei Usern, die JS deaktiviert, haben nicht funktioniert.
Edit: Die Größenänderung sollte man besser nicht mit height="" machen.
mfg Bleistift
 
Zuletzt bearbeitet:
Danke für die hilfreiche Antwort Bleistift!
Doch jz tritt mir ein sehr peinliches Problem auf.. wie gesagt mit html kann ich nicht viel anfangen.
Wie gebe ich die Bilder nun in diesen Code ein?
muss ich den genauen speicherplatz auf meiner festplatte angeben oder wie mache ich das?:?:

Danke für die nächsten Antworten!

so..
also ich bedanke mich nochmal bei Bleistift das skript ist wirklich 1A.
Habe jetzt links eingefügt und das klappt wunderbar! Aber geht das nicht vllt auch noch mit eigenen Bildern von meinem PC dass ich die da irgendwie reinbekomm? danke für jede Rückmeldung!:grin:
 
Zuletzt bearbeitet von einem Moderator:
um deine eigenen Bilder zu benutzen musst du diese zuerst auf deinen FTP-Server hochladen...
Also im prinzip dahin, wo du auch deine HTML-Tags geladen hast. Dann hat jedes deiner Bilder eine eigene Adresse und diese kannst du dann wie die links aus dem Netz benutze.
 
Werbung:
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben