looking for a random start to Ticker script

[leonschroder]

1) Script Title:
DHTML Ticker script

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

3) Describe problem:
I would really like to start the ticker at a random item in the Array of messages. After the random start it is fine that it continues taking the next item from the array.

Could you please help me on this.
Leon

[blm126]

/*Example message arrays for the two demo scrollers*/

var tickercontent=new Array()
tickercontent[0]='<a href="http://www.javascriptkit.com">JavaScript Kit</a><br />Comprehensive JavaScript tutorials and over 400+ free scripts!'
tickercontent[1]='<a href="http://www.codingforums.com">Coding Forums</a><br />Web coding and development forums.'
tickercontent[2]='<a href="http://www.cssdrive.com" target="_new">CSS Drive</a><br />Categorized CSS gallery and examples.'

var tickercontent2=new Array()
tickercontent2[0]='<a href="http://www.news.com">News.com: Technology and business reports</a>'
tickercontent2[1]='<a href="http://www.cnn.com">CNN: Headline and breaking news 24/7</a>'
tickercontent2[2]='<a href="http://news.bbc.co.uk">BBC News: UK and international news</a>'

</script>


/***********************************************
* DHTML Ticker script- &#169; Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
Array.prototype.shuffle = function( b ) {
 var i = this.length, j, t;
 while( i ) {
  j = Math.floor( ( i-- ) * Math.random() );
  t = b && typeof this[i].shuffle!=='undefined' ? this[i].shuffle() : this[i];
  this[i] = this[j];
  this[j] = t;
 }
 return this;
};
function domticker(content, divId, divClass, delay, fadeornot){
this.content = content.shuffle();
this.tickerid=divId //ID of master ticker div. Message is contained inside first child of ticker div
this.delay=delay //Delay between msg change, in miliseconds.
this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over ticker (and pause it if it is)
this.pointer=1
this.opacitystring=(typeof fadeornot!="undefined")? "width: 100%; filter:progid:DXImageTransform.Microsoft.alpha(opacity=100); -moz-opacity: 1" : ""
if (this.opacitystring!="") this.delay+=500 //add 1/2 sec to account for fade effect, if enabled
this.opacitysetting=0.2 //Opacity value when reset. Internal use.
document.write('<div id="'+divId+'" class="'+divClass+'"><div style="'+this.opacitystring+'">'+content[0]+'</div></div>')
var instanceOfTicker=this
setTimeout(function(){instanceOfTicker.initialize()}, delay)
}

domticker.prototype.initialize=function(){
var instanceOfTicker=this
this.contentdiv=document.getElementById(this.tickerid).firstChild //div of inner content that holds the messages
document.getElementById(this.tickerid).onmouseover=function(){instanceOfTicker.mouseoverBol=1}
document.getElementById(this.tickerid).onmouseout=function(){instanceOfTicker.mouseoverBol=0}
this.rotatemsg()
}

domticker.prototype.rotatemsg=function(){
var instanceOfTicker=this
if (this.mouseoverBol==1) //if mouse is currently over ticker, do nothing (pause it)
setTimeout(function(){instanceOfTicker.rotatemsg()}, 100)
else{
this.fadetransition("reset") //FADE EFFECT- RESET OPACITY
this.contentdiv.innerHTML=this.content[this.pointer]
this.fadetimer1=setInterval(function(){instanceOfTicker.fadetransition('up', 'fadetimer1')}, 100) //FADE EFFECT- PLAY IT
this.pointer=(this.pointer<this.content.length-1)? this.pointer+1 : 0
setTimeout(function(){instanceOfTicker.rotatemsg()}, this.delay) //update container
}
}

// -------------------------------------------------------------------
// fadetransition()- cross browser fade method for IE5.5+ and Mozilla/Firefox
// -------------------------------------------------------------------

domticker.prototype.fadetransition=function(fadetype, timerid){
var contentdiv=this.contentdiv
if (fadetype=="reset")
this.opacitysetting=0.2
if (contentdiv.filters && contentdiv.filters[0]){
if (typeof contentdiv.filters[0].opacity=="number") //IE6+
contentdiv.filters[0].opacity=this.opacitysetting*100
else //IE 5.5
contentdiv.style.filter="alpha(opacity="+this.opacitysetting*100+")"
}
else if (typeof contentdiv.style.MozOpacity!="undefined" && this.opacitystring!=""){
contentdiv.style.MozOpacity=this.opacitysetting
}
else
this.opacitysetting=1
if (fadetype=="up")
this.opacitysetting+=0.2
if (fadetype=="up" && this.opacitysetting>=1)
clearInterval(this[timerid])
}

[leonschroder]

Heel erg bedankt. De reden dat ik zei dat het na een random start gewoon door kon tellen was omdat ik door een array van 1700 (!) namen moet lopen en dacht dat dat sneller zou zijn. Maakt het uit denk je?

[blm126]

what?

[leonschroder]

Sorry about that Brady,

Thanks, for the help!
The reason I wanted to just take the next after a random start is that I thought it would be faster then making all the lines random. I have to go through an array of nearly 1700 names!

[blm126]

Oh, you just wanted a random start! Try this then

/***********************************************
* DHTML Ticker script- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
function domticker(content, divId, divClass, delay, fadeornot){
var ran=Math.floor(Math.random()*content.length);
while(ran > 0){
	content.push(content.shift());
        ran--;
}
this.content = content;
this.tickerid=divId //ID of master ticker div. Message is contained inside first child of ticker div
this.delay=delay //Delay between msg change, in miliseconds.
this.mouseoverBol=0 //Boolean to indicate whether mouse is currently over ticker (and pause it if it is)
this.pointer=1
this.opacitystring=(typeof fadeornot!="undefined")? "width: 100%; filter:progid:DXImageTransform.Microsoft.alpha(opacity=100); -moz-opacity: 1" : ""
if (this.opacitystring!="") this.delay+=500 //add 1/2 sec to account for fade effect, if enabled
this.opacitysetting=0.2 //Opacity value when reset. Internal use.
document.write('<div id="'+divId+'" class="'+divClass+'"><div style="'+this.opacitystring+'">'+content[0]+'</div></div>')
var instanceOfTicker=this
setTimeout(function(){instanceOfTicker.initialize()}, delay)
}

domticker.prototype.initialize=function(){
var instanceOfTicker=this
this.contentdiv=document.getElementById(this.tickerid).firstChild //div of inner content that holds the messages
document.getElementById(this.tickerid).onmouseover=function(){instanceOfTicker.mouseoverBol=1}
document.getElementById(this.tickerid).onmouseout=function(){instanceOfTicker.mouseoverBol=0}
this.rotatemsg()
}

domticker.prototype.rotatemsg=function(){
var instanceOfTicker=this
if (this.mouseoverBol==1) //if mouse is currently over ticker, do nothing (pause it)
setTimeout(function(){instanceOfTicker.rotatemsg()}, 100)
else{
this.fadetransition("reset") //FADE EFFECT- RESET OPACITY
this.contentdiv.innerHTML=this.content[this.pointer]
this.fadetimer1=setInterval(function(){instanceOfTicker.fadetransition('up', 'fadetimer1')}, 100) //FADE EFFECT- PLAY IT
this.pointer=(this.pointer<this.content.length-1)? this.pointer+1 : 0
setTimeout(function(){instanceOfTicker.rotatemsg()}, this.delay) //update container
}
}

// -------------------------------------------------------------------
// fadetransition()- cross browser fade method for IE5.5+ and Mozilla/Firefox
// -------------------------------------------------------------------

domticker.prototype.fadetransition=function(fadetype, timerid){
var contentdiv=this.contentdiv
if (fadetype=="reset")
this.opacitysetting=0.2
if (contentdiv.filters && contentdiv.filters[0]){
if (typeof contentdiv.filters[0].opacity=="number") //IE6+
contentdiv.filters[0].opacity=this.opacitysetting*100
else //IE 5.5
contentdiv.style.filter="alpha(opacity="+this.opacitysetting*100+")"
}
else if (typeof contentdiv.style.MozOpacity!="undefined" && this.opacitystring!=""){
contentdiv.style.MozOpacity=this.opacitysetting
}
else
this.opacitysetting=1
if (fadetype=="up")
this.opacitysetting+=0.2
if (fadetype=="up" && this.opacitysetting>=1)
clearInterval(this[timerid])
}

[leonschroder]

Hi again Brady,

Unfortunately I cannot get the script to work. It seems to run into a loop or something causing the browser to staal and ultimately freeze. Any ideas on what I am doing wrong?

Leon

[blm126]

Sorry, there was an error in my code. Try it out now(I have marked my change in red above)

[leonschroder]

That's just great! Thanks a lot.

[leonschroder]

Hi Brady, it works great. If you're not bothered, to really perfection it I'd like to run the second ticker as well, but starting elsewhere in the same array. Possible?