Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format for asking a question.
Try this one out:
Code:
<html>
<head><title>Thumb 2</title>
<script type="text/javascript">
/***********************************************
* Image Thumbnail Viewer II script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
* Modified here to accept external text file as well as images
* Modified for optional captions, read all comments in top
* of script and in HTML code below.
* Modifications © John Davenport Scheuer - jscheuer1TAKETHISOUTTOUSEEMAIL@comcast.net
***********************************************/
/*
IMPORTANT NOTE - In most cases specifying only a small external file for display
will yield the best results - IMPORTANT NOTE
Specify image/text file paths and optional link (set link to "" for no link)
set third parameter to "i" for image file, "t" for text file: */
var dynimages=new Array()
dynimages[0]=["photo1.jpg", "http://www.cnn.com", "i"]
dynimages[1]=["photo2.jpg", "http://www.yahoo.com", "i"]
dynimages[2]=["photo3.jpg", "http://www.google.com", "i"]
dynimages[3]=["ext.htm", "http://www.google.com", "t"]
//Set scrolling for text content if text content used("yes" or "no"):
var scrolltext="no"
//Preload images ("yes" or "no"):
var preloadimg="yes"
//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++){
if (dynimages[x][2]=='i'){
var myimage=new Image()
myimage.src=dynimages[x][0]
}
}
}
function returnimgcode(theimg){
var imghtml=""
if (theimg[1]!="")
imghtml='<a href="'+theimg[1]+'" target="'+optlinktarget+'">'
if (theimg[2]=="i")
imghtml+='<img src="'+theimg[0]+'" border="'+imgborderwidth+'">'
if (theimg[2]=="t")
imghtml+='<iframe src="'+theimg[0]+'" frameborder="'+imgborderwidth+'" height="'+document.getElementById("dynloadarea").style.height+'" scrolling="'+scrolltext+'"></iframe>'
if (theimg[1]!="")
imghtml+='</a>'
return imghtml
}
function modifyimage(loadarea, imgindex){
get_cap('');
if (document.getElementById){
var imgobj=document.getElementById(loadarea)
if (imgobj.filters && window.createPopup){
imgobj.style.filter=filterstring
imgobj.filters[0].Apply()
}
//var frameheight=imgobj.style.height
//alert(frameheight)
imgobj.innerHTML=returnimgcode(dynimages[imgindex])
if (imgobj.filters && window.createPopup)
imgobj.filters[0].Play()
return false
}
}
function get_cap(cap){
if (document.getElementById){
document.getElementById('caploadarea').innerHTML=cap;}
else if (document.all){
document.all('caploadarea').innerHTML=cap;}
else{
return;}
}
</script>
</head>
<body>
<!--Configure your links below, notice that if you add ;get_cap(this.name); to the onMouseover event
and a name to the anchor tag, you will get a caption -->
<a href="#" name="1st Image" onMouseover="modifyimage('dynloadarea', 0);get_cap(this.name);"><img src=thumb1.jpg width=50px height=50px border=0 alt="" title=""></a><br> <br>
<a href="#" onMouseover="modifyimage('dynloadarea', 1)"><img src=thumb2.jpg width=50px height=50px border=0 alt="" title=""></a><br> <br>
<a href="#" onMouseover="modifyimage('dynloadarea', 2)"><img src=thumb3.jpg width=50px height=50px border=0 alt="" title=""></a><br> <br>
<a href="#" name="Above is Some Text Content" onMouseover="modifyimage('dynloadarea', 3);get_cap(this.name);">Text Content</a><p>
<!--Configure size of display areas below -->
<div id="dynloadarea" style="width:140px;height:225px"></div>
<hr align=left width=140>
<div id="caploadarea" style="width:200px;height:2em;text-align:left"></div></body>
</html>
Bookmarks