Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „Mouseout Effekt“

T

TrisoX

Guest

Hallo ich würde gerne so einen Code wie bei dieser Seite bei mir einbinden, aber ich weiss nicht wie das geht.
Den Code selbst habe ich leider auch noch nicht.
Also ich rede von dem Effekt wenn man über diese kleinenButtons fährt erscheint in dem Orb ein grösseres Bilder.
Kann mir einer vielleicht helfen ?

Hier zur Vorschau:
 
S

schine

Guest

AW: Mouseout Effekt

Das müsste mit dhtml umgesetzt worde sein, also mit ner Funktion die beim hovern das größere bild visible macht. Hier ein Beispiel:

<html>
<head>
<title></title>
<style type="text/css">
<!--
#b1 {position:absolute; top:200px; left:200px; width:114px; height:112px; z-index:1;}
#b2 {position:absolute; top:250px; left:250px; width:113px; height:109px; z-index:2;}
#b3 {position:absolute; top:300px; left:150px; width:114px; height:111px; z-index:3;}

#a1 {position:absolute; top:200px; left:420px; visibility:hidden;font-size:20pt;background-color:#2a66bd;width:250px;height:250px;padding:10px;}
#a2 {position:absolute; top:200px; left:420px; visibility:hidden;font-size:20pt;background-color:#40a740;width:250px;height:250px;padding:10px;}
#a3 {position:absolute; top:200px; left:420px; visibility:hidden;font-size:20pt;background-color:#af3e7b;width:250px;height:250px;padding:10px;}
-->
</style>

<script type="text/javascript">
<!--
yalt="a1";
a=5;

function wechsel(x,y)
{
a++;
if(document.all)
{
document.all[x].style.zIndex=a;
document.all[yalt].style.visibility="hidden";
document.all[y].style.visibility="visible";
yalt=y;
}
else
if(document.layers)
{
document.layers[x].zIndex=a;
document.layers[yalt].visibility="hide";
document.layers[y].visibility="show";
yalt=y;
}
else
{
document.getElementById(x).style.zIndex=a;
document.getElementById(yalt).style.visibility="hidden";
document.getElementById(y).style.visibility="visible";
yalt=y;
}
}
//-->
</script>
<noscript></noscript>
</head>
<body text="#ffffff" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<div class="bild1" id="b1"><a href="#" onMouseover="wechsel('b1','a1')"><img src="AKST1.GIF" width="114" height="112" border="0" alt=""></a></div>
<div class="bild2" id="b2"><a href="#" onMouseover="wechsel('b2','a2')"><img src="AKST2.GIF" width="113" height="109" border="0" alt=""></a></div>
<div class="bild3" id="b3"><a href="#" onMouseover="wechsel('b3','a3')"><img src="AKST3.GIF" width="114" height="111" border="0" alt=""></a></div>

<div id="a1">Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text Blauer Text</div>
<div id="a2">Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text Gr&uuml;ner Text</div>
<div id="a3">Roter Text Roter Text Roter Text Roter Text Roter Text Roter Text Roter Text Roter Text Roter Text Roter Text Roter Text Roter Text</div>

</body>
</html>
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.189
Beiträge
2.582.077
Mitglieder
67.259
Neuestes Mitglied
SaschMasch1312
Oben