Results 1 to 6 of 6

Thread: Conveyor Belt slideshow Gap Problem

  1. #1
    Join Date
    May 2005
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Conveyor Belt slideshow Gap Problem

    Conveyor Belt slideshow
    Scripturl: http://www.dynamicdrive.com/dynamici...rightslide.htm

    I am using above script and it's working fine but when you enable a gap then the gap between the last image and the next first image is not visible!!!

    So, when the script reached the image 5.jpg and goes further to the beginning (1.jpg) then there is no gap!!!

    This is the code that i am using:
    PHP Code:
    <script type="text/javascript">
    var 
    sliderwidth="450px"
    var sliderheight="100px"
    var slidespeed=1
    slidebgcolor
    ="#2f6fab"

    //Specify the slider's images style="border:1px solid blue;"
    var leftrightslide=new Array()
    var 
    finalslide=''
    leftrightslide[0]='<a href="http://"><img src="1.jpg" border=0></a>'
    leftrightslide[1]='<a href="http://"><img src="2.jpg" border=0></a>'
    leftrightslide[2]='<a href="http://"><img src="3.jpg" border=0></a>'
    leftrightslide[3]='<a href="http://"><img src="4.jpg" border=0></a>'
    leftrightslide[4]='<a href="http://"><img src="5.jpg" border=0></a>'

    //Specify gap between each image (use HTML):
    var imagegap="<img src=clear.gif width=1px height=1px>"
    //Specify pixels gap between each slideshow rotation (use integer):
    var slideshowgap=0
    ////NO NEED TO EDIT BELOW THIS LINE////////////
    var copyspeed=slidespeed
    leftrightslide
    ='<nobr>'+leftrightslide.join(imagegap)+'</nobr>'
    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_slidens_slide
    function fillup(){
    if (
    iedom){
    cross_slide=document.getElementByIddocument.getElementById("test2") : document.all.test2
    cross_slide2
    =document.getElementByIddocument.getElementById("test3") : document.all.test3
    cross_slide
    .innerHTML=cross_slide2.innerHTML=leftrightslide
    actualwidth
    =document.allcross_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)
    }
    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
    }
    }
    if (
    iedom||document.layers){
    with (document){
    document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
    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" onMouseout="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" onMouseout="copyspeed=slidespeed"></layer>')
    write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
    write('</ilayer>')
    }
    document.write('</td></table>')
    }
    }
    </script> 
    Thanks for any help

  2. #2
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Well the gap you're specifying is only 1px wide, so it probably won't be detectable anyway. Try specifying a larger gap:

    Code:
    //Specify gap between each image (use HTML):
    var imagegap="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"

  3. #3
    Join Date
    May 2005
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    The gap is working fine and it does show the gap between the images but when the slide reach the last image and goes further to the beginning(the 1st image) then there is no gap! So it does show the clear.gif but not on the end.

    Thanks for your reply.

  4. #4
    Join Date
    May 2005
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Check the screenshot:


  5. #5
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Go back to the configuration of the script again, look closely at this part:

    Code:
    //Specify gap between each image (use HTML): 
    var imagegap="<img src=clear.gif width=1px height=1px>" 
    //Specify pixels gap between each slideshow rotation (use integer): 
    var slideshowgap=0 
    ////NO NEED TO EDIT BELOW THIS LINE////////////
    Unless the author of the script got it wrong, it is doing just what you told it to do. Try changing to:

    Code:
    //Specify gap between each image (use HTML): 
    var imagegap="<img src=clear.gif width=1px height=1px>" 
    //Specify pixels gap between each slideshow rotation (use integer): 
    var slideshowgap=1 
    ////NO NEED TO EDIT BELOW THIS LINE////////////
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #6
    Join Date
    May 2005
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    That did it! Thanks alot John.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •