Results 1 to 4 of 4

Thread: Translucent slide show

  1. #1
    Join Date
    Jun 2007
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Translucent slide show

    1) Script Title: Translucent slide show

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

    3) Describe problem: This is my first web page so i hope people will forgive the ignorance. When I try to post multiple slide shows it gives me an error message saying the style is noll or not an object. if this is a simple fix or if anyones knows a slide show that i can post multiples of please help me.

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

    Default

    This is just one of those legacy scripts that haven't been rewritten to support multiple instances yet. I've made a note of it, though before I can get to upgrading it, a similar script that does is: http://www.dynamicdrive.com/dynamici...ropitslide.htm

  3. #3
    Join Date
    Jan 2008
    Location
    Vermont
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs down Translucent slide show not *visible* in Opera [Version 9.63]

    nice script, but...

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

    and live slide show i made

    http://www.kingarthurflour.com/ourstore/

    not *visible* in Opera



    what needs to be done to make it work?

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

    That script is pretty out of date, as is this slightly modified version below, but it at least works in Opera and those others mentioned:

    Code:
    <script type="text/javascript">
    
    /***********************************************
    * Translucent 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 trans_width='140px' //slideshow width
    var trans_height='225px' //slideshow height
    var pause=3000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds)
    var degree=10 //animation speed. Greater is faster.
    
    var slideshowcontent=new Array()
    //Define slideshow contents: [image URL, OPTIONAL LINK, OPTIONAL LINK TARGET]
    slideshowcontent[0]=["photo1.jpg", "http://www.cnn.com", "_new"]
    slideshowcontent[1]=["photo2.jpg", "", ""]
    slideshowcontent[2]=["photo3.jpg", "http://www.google.com", ""]
    
    
    ////NO need to edit beyond here/////////////
    
    var bgcolor='white'
    
    var imageholder=new Array()
    for (i=0;i<slideshowcontent.length;i++){
    imageholder[i]=new Image()
    imageholder[i].src=slideshowcontent[i][0]
    }
    
    var ie4=document.all && !window.opera;
    var dom=document.getElementById;
    
    if (ie4||dom)
    document.write('<div style="position:relative;width:'+trans_width+';height:'+trans_height+';overflow:hidden"><div id="canvas0" style="position:absolute;background-color:'+bgcolor+';width:'+trans_width+';height:'+trans_height+';left:-'+trans_width+';filter:alpha(opacity=20);opacity:0.2;"></div><div id="canvas1" style="position:absolute;background-color:'+bgcolor+';width:'+trans_width+';height:'+trans_height+';left:-'+trans_width+';filter:alpha(opacity=20);opacity:0.2;"></div></div>')
    else if (document.layers){
    document.write('<ilayer id=tickernsmain visibility=hide width='+trans_width+' height='+trans_height+' bgColor='+bgcolor+'><layer id=tickernssub width='+trans_width+' height='+trans_height+' left=0 top=0>'+'<img src="'+slideshowcontent[0][0]+'"></layer></ilayer>')
    }
    
    var curpos=trans_width*(-1)
    var curcanvas="canvas0"
    var curindex=0
    var nextindex=1
    
    function getslidehtml(theslide){
    var slidehtml=""
    if (theslide[1]!="")
    slidehtml='<a href="'+theslide[1]+'" target="'+theslide[2]+'">'
    slidehtml+='<img src="'+theslide[0]+'" border="0">'
    if (theslide[1]!="")
    slidehtml+='</a>'
    return slidehtml
    }
    
    function moveslide(){
    if (curpos<0){
    curpos=Math.min(curpos+degree,0)
    tempobj.style.left=curpos+"px"
    }
    else{
    clearInterval(dropslide)
    if (crossobj.filters)
    crossobj.filters.alpha.opacity=100
    else if (crossobj.style.opacity)
    crossobj.style.opacity=1
    nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
    tempobj=ie4? eval("document.all."+nextcanvas) : document.getElementById(nextcanvas)
    tempobj.innerHTML=getslidehtml(slideshowcontent[curindex])
    nextindex=(nextindex<slideshowcontent.length-1)? nextindex+1 : 0
    setTimeout("rotateslide()",pause)
    }
    }
    
    function rotateslide(){
    if (ie4||dom){
    resetit(curcanvas)
    crossobj=tempobj=ie4? eval("document.all."+curcanvas) : document.getElementById(curcanvas)
    crossobj.style.zIndex++
    if (crossobj.filters)
    document.all.canvas0.filters.alpha.opacity=document.all.canvas1.filters.alpha.opacity=20
    else if (crossobj.style.opacity)
    document.getElementById("canvas0").style.opacity=document.getElementById("canvas1").style.opacity=0.2
    var temp='setInterval("moveslide()",50)'
    dropslide=eval(temp)
    curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
    }
    else if (document.layers){
    crossobj.document.write(getslidehtml(slideshowcontent[curindex]))
    crossobj.document.close()
    }
    curindex=(curindex<slideshowcontent.length-1)? curindex+1 : 0
    }
    
    function jumptoslide(which){
    curindex=which
    rotateslide()
    }
    
    function resetit(what){
    curpos=parseInt(trans_width)*(-1)
    var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
    crossobj.style.left=curpos+"px"
    }
    
    function startit(){
    crossobj=ie4? eval("document.all."+curcanvas) : dom? document.getElementById(curcanvas) : document.tickernsmain.document.tickernssub
    if (ie4||dom){
    crossobj.innerHTML=getslidehtml(slideshowcontent[curindex])
    rotateslide();
    }
    else{
    document.tickernsmain.visibility='show'
    curindex++
    setInterval("rotateslide()",pause)
    }
    }
    
    if (window.addEventListener)
    window.addEventListener("load", startit, false)
    else if (window.attachEvent)
    window.attachEvent("onload", startit)
    else if (ie4||dom||document.layers)
    window.onload=startit
    
    </script>
    - John
    ________________________

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

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
  •