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

bild hover als menü

S

sdfg

Neues Mitglied
hallo,

ich hab auf meiner website als menu mehrere fotos als liste nebne und untereinander angeordnet.
ich möchte jetzt, wenn man mit der maus über ein bild fährt, ein anderes bild (genau selbe position und selbe größe) erscheint und man dann drauf klicken kann und auf eine weitere unterseite gelangt.
ich möchte das bild nicht im vorfeld mit einem grafikporgramm zu einem zusammenfügen.
ich würde mich sehr freuen, wenn mir jemand ganz konkret sagen würde was ich dafür in meinen html body einfügen muss und was in meine css-datei.

vielen dank für die hilfe.
 
Für ganz konkrete Angaben bräuchte es Code oder besser einen Link zur Site. Du kannst das mit JavaScript machen. Mit CSS auch, indem du dem Bild eine relative positionierung gibst, das andere Bild als Hintergrunbild dahinter tust und dann beim hover den z-index änderst (könnte ich mir so jedenfalls vorstellen).
 
vielen dank!
aber wenn dann lieber mit css mit javascript kenne ich mich leider gar nicht aus!
hier der code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>XY</title>
<link rel="stylesheet" media="all" href="style.css" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>




</head>


<body>
<header>
<img src="3.png"/>
</header>


<div class="content">








<ul id="navigation">


<li><a href="mhm9.html"><img src="images/menu/1.jpg"></a></li>
<li><img src="images/menu/2.jpg"></li>
<li><img src="images/menu/3.jpg"></li>
<li><a href="4.html"><img src="images/menu/4.jpg"></a></li>
<li><img src="images/menu/5.jpg"></li>
<li><img src="images/menu/6.jpg"></li>
<li><img src="images/menu/7.jpg"></li>








</ul>






</div>












</body>
</html>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben