Click here to Skip to main content
15,117,830 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi,
I want to slide images in a table. There are 3 rows in the Table. In the first row I want to show only Animal and nature images. In the second row i want to show only Sports images and in the last row(3rd row)i want to show only people(men, women, boys and girls) images.
And i also one thing do that is mouseover event. if I am take on the mouse cursor to the image , the Slider is stop.

Thanks
Posted
Updated 28-Mar-11 2:36am
v3
Comments
Jonathan Cardy 27-Mar-11 5:01am
   
In what direction do you want to slide them - up, down, left, right? What is your JavaScript currently?
ritesh88sharma 28-Mar-11 2:47am
   
//Specify gap between each image
var imagegap=" "

//Specify pixels gap between each slideshow rotation
var slideshowgap=13

var copyspeed=slidespeed
leftrightslide='<nobr>'+leftrightslide.join(imagegap)+''
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')
var actualwidth=''
var cross_slide, ns_slide

function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2
cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp").offsetWidth
cross_slide2.style.left=actualwidth+slideshowgap+"px"
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
ns_slide.document.write(leftrightslide)
ns_slide.document.close()
actualwidth=ns_slide.document.width
ns_slide2.left=actualwidth+slideshowgap
ns_slide2.document.write(leftrightslide)
ns_slide2.document.close()
}
lefttime=setInterval("slideleft()",30)
}
ritesh88sharma 28-Mar-11 2:48am
   
window.onload=fillup

function slideleft(){
if (iedom){
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
else
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+slideshowgap+"px"

if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
else
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+slideshowgap+"px"

}
else if (document.layers){
if (ns_slide.left>(actualwidth*(-1)+8))
ns_slide.left-=copyspeed
else
ns_slide.left=ns_slide2.left+actualwidth+slideshowgap

if (ns_slide2.left>(actualwidth*(-1)+8))
ns_slide2.left-=copyspeed
else
ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
}
}
ritesh88sharma 28-Mar-11 2:48am
   
if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td valign="middle">')
if (iedom){
write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" önMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width="+sliderwidth+" height="+sliderheight+" name="ns_slidemenu" bgcolor="+slidebgcolor+">')
write('<layer name="ns_slidemenu2" left="0" top="0" onmouseover="copyspeed=0" önmouseout="copyspeed=slidespeed">')
write('<layer name="ns_slidemenu3" left="0" top="0" onmouseover="copyspeed=0" önmouseout="copyspeed=slidespeed">')
write('')
}
document.write('</td></table>')
}
}

</script>

1 solution

If I were you I'd go for jQuery[^] and one of the available carousel[^] plugins one can get for it.

Cheers!
   

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900