Jump to content

Lost A Script :(


ThumpAZ

Recommended Posts

I have had this script for a while now, and now cannot find it.

The action is for image galleries and loading them into a central screen on click

 

What it is:

open gallery in a page

on the page, thumbnails are surrounding a central background type image

when you click on the thumbnail, the image fades into the central image and fills that speace.

 

Any help? I have seen it in some places, but cannot recall where either.

 

ARRRGH!!!

Link to comment
Share on other sites

If you are familiar with javascript you can just use the below script and modify as necessary:

 

<head>

 

<script type="text/javascript">

 

 

//Specify image paths and optional link (set link to "" for no link):

var dynimages=new Array()

dynimages[0]=["photo1.jpg", "http://www."]'>http://www."]'>http://www."]

dynimages[1]=["photo2.jpg", "http://www."]

dynimages[2]=["photo3.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>

</head>

 

<body>

 

<a href="#" onMouseover="modifyimage('dynloadarea', 0)">image 1 (onmouseover)</a><br>

<a href="#" onMouseover="modifyimage('dynloadarea', 1)">image 2 (onmouseover)</a><br>

<a href="#" onClick="return modifyimage('dynloadarea2', 2)">image 3 (onclick)</a><p>

 

<div id="dynloadarea" style="width:80px;height:225px"></div>

 

<div id="dynloadarea2" style="width:80px;height:200px"></div>

</body>

 

 

The section within the body is where you specify how to set up the thumbnails to display the larger images.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...