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

bildleiste

Status
Für weitere Antworten geschlossen.

jhaustein

Mitglied
hallo gemeinschaft

suche ein javascript, bei dem ich horizontal 7 oder 8 bilder sehen kann und an der rechten und linken aussenseite einen pfeil habe, mit denen ich die bilder nach recht und links durchscrollen kann - könnt ihr mir dabei bitte helfen
 
Werbung:
ja, bekomme es nur nicht zum laufen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Unbenanntes Dokument</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
/* example_3 css */
#example_3 {
position: relative; /* important */
overflow: hidden; /* important */
width: 470px; /* important */
height: 86px; /* important */
margin: 0 85px;
background: #000;
}

#example_3_frame {position: relative}
#example_3_previous {float: left;}
#example_3_next {float: right;}
#example_3_content {
position: absolute;
top: 0;
margin-left: 20px;
}

#example_3_content
#example_3_content li {
list-style: none;
margin: 0;
padding: 0;
}
#example_3_content {
width: 5418px;
}
#container_bd #example_3 ul li {
display: block;
float: left;
margin: 5px;
padding: 5px;
border: 1px solid #666;
background-color: #000;
}

#container_bd #example_3 ul li img {
display: block;
}




</style>
<script>
window.addEvent("domready", function() {
new iCarousel("example_3_content", {
idPrevious: "example_3_previous",
idNext: "example_3_next",
idToggle: "undefined",
item: {
klass: "example_3_item",
size: 86
},
animation: {
duration: 1000,
amount: 4
}
});
});
</script>
</head>

<body>
<h3>III. Horizontal images scroller</h3>
<div id="example_3">
<ul id="example_3_content">
<li class="example_3_item"><a href="#"><img src="images/flowers/1.jpg" alt="flower 1" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/2.jpg" alt="flower 2" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/3.jpg" alt="flower 3" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/4.jpg" alt="flower 4" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/5.jpg" alt="flower 5" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/6.jpg" alt="flower 6" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/7.jpg" alt="flower 7" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/8.jpg" alt="flower 8" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/9.jpg" alt="flower 9" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/A.jpg" alt="flower A" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/B.jpg" alt="flower B" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/C.jpg" alt="flower C" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/D.jpg" alt="flower D" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/E.jpg" alt="flower E" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/F.jpg" alt="flower F" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/G.jpg" alt="flower G" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/H.jpg" alt="flower H" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/I.jpg" alt="flower I" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/J.jpg" alt="flower J" /></a></li>
<li class="example_3_item"><a href="#"><img src="images/flowers/K.jpg" alt="flower K" /></a></li>
</ul>
<div id="example_3_frame">
<img id="example_3_previous" src="images/ex3_previous.gif" alt="move previous" />
<img id="example_3_next" src="images/ex3_next.gif" alt="move next" />
</div>
</div>

</body>
</html>
 
Werbung:
Status
Für weitere Antworten geschlossen.
Zurück
Oben