PDA

View Full Version : Add Memory to Billboard Script



Mtwo
09-07-2007, 02:58 AM
1) Script Title: DHTML Billboard Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex2/dhtmlbillboard.htm

3) Description: Add memory to Billboard?

Is there a way to add the ability for the billboard script to remember the last billboard div displayed and the display that one or the next in line the next time the user returns to the page? Similar to the functionality of Memory Ticker (http://www.dynamicdrive.com/dynamicindex2/memoryticker.htm)?

I would like to have 10 or more different div's with text and images. I want to rotate through each div sequentially, allowing the user to see each, in order, regardless of leaving the page and coming back. So the billboard will cycle through all of the div's without always starting with the first div, but picks up the billboard display from where it last left off.

If there is a way to do this, please let me know.

Thanks,

M

ddadmin
09-09-2007, 09:08 AM
Sure, replace the default script (not its CSS) with the below version instead, which adds persistence to the currently shown content:


<script type="text/javascript">

/***********************************************
* DHTML Billboard script- &#169; Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

//List of transitional effects to be randomly applied to billboard:
var billboardeffects=["GradientWipe(GradientSize=1.0 Duration=0.7)", "Inset", "Iris", "Pixelate(MaxSquare=5 enabled=false)", "RadialWipe", "RandomBars", "Slide(slideStyle='push')", "Spiral", "Stretch", "Strips", "Wheel", "ZigZag"]

//var billboardeffects=["Iris"] //Uncomment this line and input one of the effects above (ie: "Iris") for single effect.

var tickspeed=2000 //ticker speed in miliseconds (2000=2 seconds)
var effectduration=500 //Transitional effect duration in miliseconds
var hidecontent_from_legacy=1 //Should content be hidden in legacy browsers- IE4/NS4 (0=no, 1=yes).

var filterid=Math.floor(Math.random()*billboardeffects.length)

document.write('<style type="text/css">\n')
if (document.getElementById)
document.write('.billcontent{display:none;\n'+'filter:progid:DXImageTransform.Microsoft.'+billboardeffects[filterid]+'}\n')
else if (hidecontent_from_legacy)
document.write('#contentwrapper{display:none;}')
document.write('</style>\n')

var selectedDiv=0
var totalDivs=0

function contractboard(){
var inc=0
while (document.getElementById("billboard"+inc)){
document.getElementById("billboard"+inc).style.display="none"
inc++
}
}

function expandboard(){
var selectedDivObj=document.getElementById("billboard"+selectedDiv)
contractboard()
if (selectedDivObj.filters){
if (billboardeffects.length>1){
filterid=Math.floor(Math.random()*billboardeffects.length)
selectedDivObj.style.filter="progid:DXImageTransform.Microsoft."+billboardeffects[filterid]
}
selectedDivObj.filters[0].duration=effectduration/1000
selectedDivObj.filters[0].Apply()
}
selectedDivObj.style.display="block"
if (selectedDivObj.filters)
selectedDivObj.filters[0].Play()
document.cookie="billboardmemory="+selectedDiv+";"
selectedDiv=(selectedDiv<totalDivs-1)? selectedDiv+1 : 0
setTimeout("expandboard()",tickspeed)
}

function startbill(){
while (document.getElementById("billboard"+totalDivs)!=null)
totalDivs++
if (document.getElementById("billboard0").filters)
tickspeed+=effectduration
if (getCookie("billboardmemory")!="")
selectedDiv=parseInt(getCookie("billboardmemory"))
expandboard()
}

function getCookie(Name){
var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
if (document.cookie.match(re)) //if cookie found
return document.cookie.match(re)[0].split("=")[1] //return its value
return ""
}

if (window.addEventListener)
window.addEventListener("load", startbill, false)
else if (window.attachEvent)
window.attachEvent("onload", startbill)
else if (document.getElementById)
window.onload=startbill

</script>

Mtwo
09-10-2007, 02:46 PM
Excellent! It works! Thank you, I do appreciate it.

I also added the pause on hover from this thread (http://www.dynamicdrive.com/forums/showthread.php?p=108667) and everything works great.

Thanks again,

M