Results 1 to 2 of 2

Thread: Multiframe Slideshow: Stop w/Specific Images?

  1. #1
    Join Date
    Mar 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Multiframe Slideshow: Stop w/Specific Images?

    Script: MultiFrame slideshow script

    I love the multiframe slideshow script. For an artist site, it displays 4 Kachina dolls, each doll has 4 views, so a total of 16 pics. Rather than a repeating cycle, I'd like for it to stop at the end of the 16 pics and display the first pic of each of the four dolls. Is this possible?

    Here's the link: http://naminghaarts.com/2.html

    Toni
    Pegasus Technology Services, Inc.
    Last edited by ddadmin; 03-06-2010 at 10:49 PM.

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

    Default

    Try the below modified .js file, which should stop the slideshow when it's done showing all your images the first time around:

    Code:
    <script type="text/javascript">
    
    /***********************************************
    * MultiFrame Image Slideshow script-  Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
    ***********************************************/
    
    var seqslides=new Array()
    //Set Path to Image plus optional URL ("" for no URL):
    seqslides[0]=["dd1.gif", "http://www.dynamicdrive.com"]
    seqslides[1]=["dd2.gif", "http://www.javascriptkit.com"]
    seqslides[2]=["dd3.gif", "http://www.google.com"]
    seqslides[3]=["dd4.gif", "http://www.yahoo.com"]
    seqslides[4]=["dd1.gif", "http://www.google.com"]
    seqslides[5]=["dd2.gif", "http://www.yahoo.com"]
    
    //Set pause between each image display (2000=2 second):
    var slidedelay=1000
    
    //Set how many images to show at once (must be less than total # of images above):
    var slidestoreveal=2
    
    //Specify code to insert between each slide (ie: "<br>" to insert a line break and create a vertical layout)
    //"" for none (or horizontal):
    var slideseparater="<br>"
    
    //Set optional link target to be added to all images with a link:
    var optlinktarget="secwindow"
    
    //Set image border width:
    var imgborderwidth=0
    
    //Set opacity value of each image when it's "dimmed", and when it's not, respectively (1=100% opaque/normal).
    //Change 0.2 to 0 to completely hide image when it's dimmed:
    var opacityvalues=[0.2,1]
    
    ///No need to edit beyond here///////////
    
    function processimgcode(theimg){
    var imghtml=""
    if (theimg[1]!="")
    imghtml='<a href="'+theimg[1]+'" target="'+optlinktarget+'">'
    imghtml+='<img src="'+theimg[0]+'" border="'+imgborderwidth+'" style="filter:alpha(opacity='+(opacityvalues[0]*100)+');-moz-opacity:'+opacityvalues[0]+'">'
    if (theimg[1]!="")
    imghtml+='</a>'
    return imghtml
    }
    
    var curslide=1 //var to track current slide (total: slidestoreveal)
    var curimgindex=0 //var to track current image (total: seqslides.length)
    var isfirstcycle=1 //boolean to indicate whether this is the first cycle
    
    if (document.getElementById){
    for (i=0;i<slidestoreveal;i++)
    document.write('<span id="seqslide'+i+'" class="seqslidestyle">'+processimgcode(seqslides[i])+'</span>'+slideseparater)
    curimgindex=slidestoreveal
    illuminateslide(0,opacityvalues[1])
    }
    
    function illuminateslide(slideindex, amt){
    var slideobj=document.getElementById("seqslide"+slideindex).getElementsByTagName("IMG")[0]
    if (slideobj.filters)
    slideobj.filters.alpha.opacity=amt*100
    else if (slideobj.style.MozOpacity)
    slideobj.style.MozOpacity=amt
    }
    
    function displayit(){
    if (curimgindex+1==seqslides.length)
    clearInterval(multitimer)
    if (curslide<slidestoreveal){
    if (!isfirstcycle)
    changeimage(curslide)
    illuminateslide(curslide, opacityvalues[1])
    curslide++
    }
    else{
    isfirstcycle=0
    for (i=0;i<slidestoreveal;i++)
    illuminateslide(i, opacityvalues[0])
    changeimage(0)
    illuminateslide(0, opacityvalues[1])
    curslide=1
    }
    }
    
    function changeimage(slideindex){
    document.getElementById("seqslide"+slideindex).innerHTML=processimgcode(seqslides[curimgindex])
    curimgindex++
    if (curimgindex>=seqslides.length)
    curimgindex=0
    }
    
    if (document.getElementById)
    var multitimer=setInterval("displayit()",slidedelay)
    
    
    </script>
    Change the images to your own obviously.
    DD Admin

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
  •