Results 1 to 6 of 6

Thread: Up-down Image Slideshow Script variable

  1. #1
    Join Date
    May 2008
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Up-down Image Slideshow Script variable

    1) Script Title: Up-down Image Slideshow Script

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...pdownslide.htm

    3) Describe problem:
    I want multiple images to show at once, with a height of 400px.

    thqanks
    heres the code
    <body>

    <script language="JavaScript1.2">

    /*
    Up down slideshow Script
    By Dynamic Drive (www.dynamicdrive.com)
    For full source code, terms of use, and 100's more scripts, visit http://www.dynamicdrive.com
    */

    ///////configure the below four variables to change the style of the slider///////
    //set the scrollerwidth and scrollerheight to the width/height of the LARGEST image in your slideshow!
    var scrollerwidth='103px'
    var scrollerheight='106px'
    //3000 miliseconds=3 seconds
    var pausebetweenimages=3000

    //configure the below variable to change the images used in the slideshow. If you wish the images to be clickable, simply wrap the images with the appropriate <a> tag
    var slideimages=new Array()
    slideimages[0]='<a href="http://www.cnn.com"><img src="PE01805A.gif" border="0"></a>'
    slideimages[1]='<img src="PE01803A.gif">'
    slideimages[2]='<img src="TN00411A.gif">'
    slideimages[3]='<img src="PE02054A.gif">'
    slideimages[4]='<img src="cake.gif">'
    //extend this list

    ///////Do not edit pass this line///////////////////////

    var ie=document.all
    var dom=document.getElementById

    if (slideimages.length>2)
    i=2
    else
    i=0

    function move1(whichlayer){
    tlayer=eval(whichlayer)
    if (tlayer.top>0&&tlayer.top<=5){
    tlayer.top=0
    setTimeout("move1(tlayer)",pausebetweenimages)
    setTimeout("move2(document.main.document.second)",pausebetweenimages)
    return
    }
    if (tlayer.top>=tlayer.document.height*-1){
    tlayer.top-=5
    setTimeout("move1(tlayer)",50)
    }
    else{
    tlayer.top=parseInt(scrollerheight)
    tlayer.document.write(slideimages[i])
    tlayer.document.close()
    if (i==slideimages.length-1)
    i=0
    else
    i++
    }
    }

    function move2(whichlayer){
    tlayer2=eval(whichlayer)
    if (tlayer2.top>0&&tlayer2.top<=5){
    tlayer2.top=0
    setTimeout("move2(tlayer2)",pausebetweenimages)
    setTimeout("move1(document.main.document.first)",pausebetweenimages)
    return
    }
    if (tlayer2.top>=tlayer2.document.height*-1){
    tlayer2.top-=5
    setTimeout("move2(tlayer2)",50)
    }
    else{
    tlayer2.top=parseInt(scrollerheight)
    tlayer2.document.write(slideimages[i])
    tlayer2.document.close()
    if (i==slideimages.length-1)
    i=0
    else
    i++
    }
    }

    function move3(whichdiv){
    tdiv=eval(whichdiv)
    if (parseInt(tdiv.style.top)>0&&parseInt(tdiv.style.top)<=5){
    tdiv.style.top=0+"px"
    setTimeout("move3(tdiv)",pausebetweenimages)
    setTimeout("move4(second2_obj)",pausebetweenimages)
    return
    }
    if (parseInt(tdiv.style.top)>=tdiv.offsetHeight*-1){
    tdiv.style.top=parseInt(tdiv.style.top)-5+"px"
    setTimeout("move3(tdiv)",50)
    }
    else{
    tdiv.style.top=scrollerheight
    tdiv.innerHTML=slideimages[i]
    if (i==slideimages.length-1)
    i=0
    else
    i++
    }
    }

    function move4(whichdiv){
    tdiv2=eval(whichdiv)
    if (parseInt(tdiv2.style.top)>0&&parseInt(tdiv2.style.top)<=5){
    tdiv2.style.top=0+"px"
    setTimeout("move4(tdiv2)",pausebetweenimages)
    setTimeout("move3(first2_obj)",pausebetweenimages)
    return
    }
    if (parseInt(tdiv2.style.top)>=tdiv2.offsetHeight*-1){
    tdiv2.style.top=parseInt(tdiv2.style.top)-5+"px"
    setTimeout("move4(second2_obj)",50)
    }
    else{
    tdiv2.style.top=scrollerheight
    tdiv2.innerHTML=slideimages[i]
    if (i==slideimages.length-1)
    i=0
    else
    i++
    }
    }

    function startscroll(){
    if (ie||dom){
    first2_obj=ie? first2 : document.getElementById("first2")
    second2_obj=ie? second2 : document.getElementById("second2")
    move3(first2_obj)
    second2_obj.style.top=scrollerheight
    second2_obj.style.visibility='visible'
    }
    else if (document.layers){
    document.main.visibility='show'
    move1(document.main.document.first)
    document.main.document.second.top=parseInt(scrollerheight)+5
    document.main.document.second.visibility='show'
    }
    }

    window.onload=startscroll

    </script>


    <ilayer id="main" width=&{scrollerwidth}; height=&{scrollerheight}; visibility=hide>
    <layer id="first" left=0 top=1 width=&{scrollerwidth};>
    <script language="JavaScript1.2">
    if (document.layers)
    document.write(slideimages[0])
    </script>
    </layer>
    <layer id="second" left=0 top=0 width=&{scrollerwidth}; visibility=hide>
    <script language="JavaScript1.2">
    if (document.layers)
    document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])
    </script>
    </layer>
    </ilayer>

    <script language="JavaScript1.2">
    if (ie||dom){
    document.writeln('<div id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hidden;">')
    document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0px;top:0px">')
    document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:1px;">')
    document.write(slideimages[0])
    document.writeln('</div>')
    document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:0px;visibility:hidden">')
    document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])
    document.writeln('</div>')
    document.writeln('</div>')
    document.writeln('</div>')
    }
    </script>

    <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>
    thanks, here is the url of where I have it placed just incase you need it.,
    http://boxedbliss.com/index.html
    Last edited by ducatigirl; 05-20-2008 at 10:54 AM. Reason: forgot url

  2. #2
    Join Date
    Feb 2008
    Location
    Cebu City Philippines
    Posts
    1,160
    Thanks
    17
    Thanked 277 Times in 275 Posts

    Default

    What's the problem?..the images not showing?..
    Have you checked if it's the correct image source

    ...Also, you have this image (for example):
    Code:
    bin/product images/150/2619_004.jpg
    I get a url not found error. And try to have a folder without spaces, it might cause conflicts
    Learn how to code at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph!

  3. #3
    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

    Also, the 'bin' folder is oftentimes not a public folder. If you want your images to be viewable on the web, they must be in a folder that is viewable on the web.

    As far as changing the number of images viewable at one time goes, that would be much easier to help you with if we could actually see the images. Once we take care of the images not showing up at all, we can look into it.
    - John
    ________________________

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

  4. #4
    Join Date
    May 2008
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thanks,
    I did not know that about the bin folder as thats where all the product images are and i was able to view them in my browser.
    Have moved them and removed space.
    http://boxedbliss.com/index.html
    I use firefox.
    i want more than one image to scroll at a time
    have used horizontal conveyor belt script and its good,all images are flowing one after the other, but want vertical.
    Thanks.

  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

    This (yet another script) will probably work for that then:

    http://home.comcast.net/~jscheuer1/s...ee_v_slide.htm

    Use your browser's 'view source' to get the well documented code. If you have questions on it, just ask.
    - John
    ________________________

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

  6. The Following User Says Thank You to jscheuer1 For This Useful Post:

    ducatigirl (05-20-2008)

  7. #6
    Join Date
    May 2008
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    That is perfect, thank you so very much, and to others who helped, it is very appreciated!!

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
  •