Nézd meg ezt, talál még jobb is mint amit te találtál nem kell kattingatni:
A képeket az images mappába kellene betenni photo[x].jpg néven ahol x -> 0 tól végtelenig
PHP kód:
<!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" />
<!-- Fotoalbum script eleje -->
<script type="text/javascript">
/***********************************************
* Image Thumbnail Viewer II script- © Dynamic Drive DHTML code library (dynamicdrive.com)
* Visit hxxp://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/
//Specify image paths and optional link (set link to "" for no link):
var dynimages=new Array()
dynimages[0]=["images/photo0.jpg", "http://www."]
dynimages[1]=["images/photo1.jpg", "http://www."]
dynimages[2]=["images/photo2.jpg", "http://www."]
dynimages[3]=["images/photo3.jpg", "http://www."]
dynimages[4]=["images/photo4.jpg", "http://www."]
dynimages[5]=["images/photo5.jpg", "http://www."]
//Preload images ("yes" or "no"):
var preloadimg="no"
//Set optional link target to be added to all images with a link:
var optlinktarget=""
//Set image border width
var imgborderwidth=0
//Optionally, change 1.0 and 0.7 below to affect Wipe gradient size and duration in seconds in IE5.5+:
var filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0 Duration=0.7)"
///////No need to edit beyond here/////
if (preloadimg=="yes"){
for (x=0; x<dynimages.length; x++){
var myimage=new Image()
myimage.src=dynimages[x][0]
}
}
function returnimgcode(theimg){
var imghtml=""
if (theimg[1]!="")
imghtml='<a href="'+theimg[1]+'" target="'+optlinktarget+'">'
imghtml+='<img src="'+theimg[0]+'" border="'+imgborderwidth+'">'
if (theimg[1]!="")
imghtml+='</a>'
return imghtml
}
function modifyimage(loadarea, imgindex){
if (document.getElementById){
var imgobj=document.getElementById(loadarea)
if (imgobj.filters && window.createPopup){
imgobj.style.filter=filterstring
imgobj.filters[0].Apply()
}
imgobj.innerHTML=returnimgcode(dynimages[imgindex])
if (imgobj.filters && window.createPopup)
imgobj.filters[0].Play()
return false
}
}
</script>
<!-- Fotóalbum script vége -->
<title>Fotóalbum</title>
</head>
<body>
<table width="80%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td>
<p>
<a href="#" onMouseover="modifyimage('dynloadarea', 0)"><img src="images/photo0.jpg"width="100" height="75"></a>
<a href="#" onMouseover="modifyimage('dynloadarea', 1)"><img src="images/photo1.jpg"width="100" height="75"></a>
<a href="#" onMouseover="modifyimage('dynloadarea', 2)"><img src="images/photo2.jpg"width="100" height="75"></a>
<a href="#" onMouseover="modifyimage('dynloadarea', 3)"><img src="images/photo3.jpg"width="100" height="75"></a>
<a href="#" onMouseover="modifyimage('dynloadarea', 4)"><img src="images/photo4.jpg"width="100" height="75"></a>
<a href="#" onMouseover="modifyimage('dynloadarea', 5)"><img src="images/photo5.jpg"width="100" height="75"></a>
<br>
<p>
<div id="dynloadarea" style="width:200px;height:150px"></div></p>
</td>
</tr>
</table>
</body>
</html>
Minimális html ismeret szükséges az átalakításhoz ha nem megy kérdez majd segítünk
Könyvjelzők