THIS ONLY WORKS WITH FIREFOX!
But will give you a good idea of how this kind of thing works. See if you can find a better one that works in FF and IE and let us know!
---Copy and paste this code into a txt document:
---Save as ImageSwap.js and close. Make sure the extention is .js and not something else. If it says .txt on it, rename it so that it says ImageSwap.js!Code:/***** M U L T I S W A P ***** scripterlative.com modified for vShare by webgeek-design.com ** DO NOT EDIT BELOW HERE OR REMOVE PROGRAMMER CREDITS***/ function ImageSwap(imgRef, period) { this.period=period; this.timer=null; this.index=0; this.theElem=document.getElementById(imgRef); this.defSrc=this.theElem.src; this.imgData=[]; for(var i=2,j=0; i<arguments.length; i++,j++) { this.imgData[j]=new Image(); this.imgData[j].src=arguments[i]; } this.trigElem = (this.theElem.parentNode.tagName=='A' ? this.theElem.parentNode : this.theElem); this.trigElem.onmouseout=this.trigElem.onblur=(function(obj){ return function() { clearInterval(obj.timer); obj.theElem.src=obj.defSrc; obj.index=0; }})(this); this.trigElem.onmouseover=this.trigElem.onfocus=(function(obj){return function() { obj.trigElem.onmouseout(); obj.timer=setInterval( (function(inst){return function(){inst.swap()}})(obj), obj.period); }})(this); this.swap=function(/*73637269707465726C61746976652E636F6D*/) { if(this.index==this.imgData.length) this.index=0; this.theElem.src=this.imgData[ this.index++ ].src; } } /** End **/
---Open templates/header.tpl
---Look for:
---Add below that:Code:<script language="JavaScript" type="text/javascript" src="{$baseurl}/js/myjavascriptajax.js"></script>
---Save and close header.tplCode:<script language="JavaScript" type="text/javascript" src="{$baseurl}/js/ImageSwap.js"></script>
---Open templates/index.tpl
---Look for:
---Replace with:Code:[img]{$tmburl}/1_{$new_video[i].VID}.jpg[/img]
---Add below that:Code:[img]{$tmburl}/1_{$new_video[i].VID}.jpg[/img]
---Look for:Code:<script type='text/javascript'> new ImageSwap ('new', 800, '{$tmburl}/2_{$new_video[i].VID}.jpg','{$tmburl}/3_{$new_video[i].VID}.jpg','{$tmburl}/1_{$new_video[i].VID}.jpg'); </script>
---Replace with:Code:[img]{$tmburl}/1_{$recent[i].VID}.jpg[/img]
---Add below that:Code:[img]{$tmburl}/1_{$recent[i].VID}.jpg[/img]
---Save and close your index.tplCode:<script type='text/javascript'> new ImageSwap ('recent', 800, '{$tmburl}/2_{$recent[i].VID}.jpg','{$tmburl}/3_{$recent[i].VID}.jpg','{$tmburl}/1_{$recent[i].VID}.jpg'); </script>
---Upload ImageSwap.js to the js directory
---Upload header.tpl and index.tpl to the templates directory
---Done! Visit your vShare site and see that it works.
AS ALWAYS, RENAME YOUR ORIGINAL FILES BEFORE UPLOADING SO THAT IF THIS DOESN'T WORK LIKE YOU EXPECTED YOU CAN REVERT BACK TO YOUR ORIGINAL FILES!
Now, you'll notice the number 800 in this code...that is the timer for the image cycle. You can speed it up or slow it down...the higher the number, the slower the images will cycle eg:to make it go really fast, set it to 100.
Enjoy!




Reply With Quote
Bookmarks