slide show

**ravifine** · 05-22-2006, 05:52 PM

HI

Iam trying to do slideshow like in http://www.msn.com home page can any on help that would be appreciated

**jscheuer1** · 05-22-2006, 06:10 PM

This is the closest thing DD has to that:

http://www.dynamicdrive.com/dynamici...dhtmlslide.htm

It can be adapted to be almost identical. Unless you are fairly knowledgeable about IE proprietary filters and javascript in general, doing so would be difficult but, if you are interested and lack such knowledge -

Make up a demo page using the above script placed in your layout as you envision it, configured with your images, and I will adapt it for you.

**ravifine** · 05-22-2006, 06:19 PM

Hi John

Iam trying with the same example Iam unable to get that identical as in msn can you give me the code that would be great

**ravifine** · 05-22-2006, 08:46 PM

hi

can you adapt with general images? provide me the code that would be great

thanks
ravi

**jscheuer1** · 05-22-2006, 09:32 PM

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">

/***********************************************
* DHTML slideshow script-  © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice must stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var photos=new Array()
var photoslink=new Array()
var which=0

//define images. You can have as many as you want:
photos[0]="photo1.jpg"
photos[1]="photo2.jpg"
photos[2]="photo3.jpg"

//Specify whether images should be linked or not (1=linked)
var linkornot=1

//Set corresponding URLs, width and height for links in a new window
//for each of above images. Define ONLY if variable linkornot equals "1"
photoslink[0]=["http://www.google.com/", 300, 250]
photoslink[1]=["http://www.yahoo.com/", 500, 100]
photoslink[2]=["http://www.dynamicdrive.com/", 375, 200]

//do NOT edit pass this line

var preloadedimages=new Array()
for (i=0;i<photos.length;i++){
preloadedimages[i]=new Image()
preloadedimages[i].src=photos[i]
}

function applyeffect(){
if (document.all && photoslider.filters){
photoslider.filters[0].Stop()
photoslider.filters[0].Apply()
}
}

function playeffect(){
if (document.all && photoslider.filters)
photoslider.filters[0].Play();
}

function keeptrack(){
window.status="Image "+(which+1)+" of "+photos.length
}

function backward(){
clearTimeout(moving);
which=which>0? which-1 : photos.length-1
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
moving=setTimeout("forward2()",6000)
}

function forward(){
clearTimeout(moving);
which=which<photos.length-1? which+1 : 0
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
moving=setTimeout("forward2()",6000)
}

function forward2(){
clearTimeout(moving);
which=which<photos.length-1? which+1 : 0
applyeffect()
document.images.photoslider.src=photos[which]
playeffect()
keeptrack()
moving=setTimeout("forward2()",3000)
}

function transport(){
window.open(photoslink[which][0],'','width='+photoslink[which][1]+', height='+photoslink[which][2])
}

function move(){
setTimeout("keeptrack()",20);
moving=setTimeout("forward2()",3000)
}

onload=move;

</script>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td  colspan="2" height="22"><center>
<script>
if (linkornot==1)
document.write('<a href="javascript:transport()">')
document.write('<img style="filter:progid:DXImageTransform.Microsoft.Fade()" src="'+photos[0]+'" name="photoslider" border=0>')
if (linkornot==1)
document.write('</a>')
</script>
</center></td>
  </tr>
  <tr>
    <td width="50%" height="21"><p align="left"><a href="#" onClick="backward();return false">Previous Slide</a></td>
    <td width="50%" height="21"><p align="right"><a href="#" onClick="forward();return false">Next Slide</a></td>
  </tr>
</table>

<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>
<a href="http://dynamicdrive.com">Dynamic Drive</a></font></p>
</body>
</html>