PHP:
<!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=iso-8859-1" />
<title>DHTML image viewer</title>
<style type="text/css">
.photos {
overflow: hidden;
padding: 10px;
width: 400px;
margin: 0 auto;
}
img { border: none;}
.photos div img {
padding: 10px 0;
margin: 20px 0;
float: left;
}
.photos ul.thumbs {
margin: 0;
padding: 0 0 0 10px;
list-style: none;
width: 390px;
float: left;
}
.photos ul.thumbs li{
width: 110px;
height: 100px;
margin: 0 10px 0 0;
padding: 0;
float: left;
overflow: hidden;
position: relative;
text-align: center;
}
.photos ul.thumbs li img {
position: absolute;
top: -180px;
left: -145px;
}
</style>
</head>
<body>
<script language="javascript" type="text/javascript">
function switch_img(divName, totalImgs) {
for (var i=1; i<=totalImgs; i++) {
var showDivName = 'photo_' + i;
var showObj = document.getElementById(showDivName);
if (showDivName == divName)
showObj.style.display = 'block';
else
showObj.style.display = 'none';
}
}
</script>
<div class="photos">
<ul class="thumbs">
<li><a href="javascript:void(0)" onclick="switch_img('photo_1', 4);"><img src="1.jpg" alt="" /></a></li>
<li><a href="javascript:void(0)" onclick="switch_img('photo_2', 4);"><img src="2.jpg" alt="" /></a></li>
<li><a href="javascript:void(0)" onclick="switch_img('photo_3', 4);"><img src="3.jpg" alt="" /></a></li>
<li><a href="javascript:void(0)" onclick="switch_img('photo_4', 4);"><img src="4.jpg" alt="" /></a></li>
</ul>
</div>
<div id="control">
<button id="left"><-</button>
<button id="right">-></button>
</div>
<div class="photos">
<div id="photo_1"><img src="1.jpg" /></div>
<div id="photo_2" style="display:none;"><img src="2.jpg" alt="" /></div>
<div id="photo_3" style="display:none;"><img src="3.jpg" alt="" /></div>
<div id="photo_4" style="display:none;"><img src="4.jpg" alt="" /></div>
</div>
</body>
</html>die beiden pfeile sollen eigentlich ab 3 bildern das scrollen nach liunks und rechts durch die bilder ermoeglichen UND ich wollte eigentlich noch ein drag and drop der Bilder haben, das man die aus den thumbs oben runter in die preview ansicht ziehen kann....
Bin für jede Hilfe dankbar.
