1 Second Pause on Tab Content Script

[kris@ennis]

1) Script Title: Tab Content Script (v 2.2)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm

3) Describe problem: http://www.ennis.com

Right now, when a user scrolls over the tabs, the content changes. At first, this seemed like a great idea, but I've heard several users complain and its been annoying me also.

What I would like to add is a 1 second pause to each tab. If a user scrolls over another tab, it wont automatically jump to that tab, but pause for 1 second, then go to the selected tab (or go to that tab by click). Any help as to where to make this change in the script. Thanks!

[ddadmin]

Try replacing the following code in your .js file:


this.tabs[i].onmouseover=function(){
tabinstance.expandtab(this)
tabinstance.cancelautorun() //stop auto cycling of tabs (if running)
return false
}

with the below instead:


this.tabs[i].onmouseover=function(){
tabinstance.cancelautorun() //stop auto cycling of tabs (if running)
clearTimeout(tabinstance.delayshow)
var curtab=this
tabinstance.delayshow=setTimeout(function(){
tabinstance.expandtab(curtab)
return false
}, 1000)
}
this.tabs[i].onmouseout=function(){
clearTimeout(tabinstance.delayshow)
}

The 1000 denotes 1 second (or 1000 milliseconds), so you can adjust as desired.

[kris@ennis]

That worked great ddadmin! Thanks for doing that.

One last question... is it possible to allow the user to not only scroll over and wait, but also have the option to go to that tab by click? As of right now, you have to wait half a second for the tab to change.

www.ennis.com

Thanks!

[ddadmin]

Sure. Directly beneath the new code I posted above, try adding the following block:


this.tabs[i].onclick=function(){
tabinstance.expandtab(this)
tabinstance.cancelautorun() //stop auto cycling of tabs (if running)
clearTimeout(tabinstance.delayshow)
return false

}

[kris@ennis]

Man, you're amazing. Thank you! Works great!