Snap Builder Public Codes Library
Snap | Generators | Login | Browse | Search | Enter Code | Export Snap Builder Public Codes Library


Category: Javascript Codes Library >> Text >> Content Switch Ticker

Code Snippet </> Info

Snippet Name: Content Switch Ticker

Description: Easily switch your text content with this code snippet.

Compatible Browsers:
Chrome BrowserFirefox BrowserInternet Explorer BrowserOpera BrowserSafari Browser

Example: View Code Demo


Author: James Crooke

Last Modified: 2019-12-10 01:11:44

Language: javascript

Highlight Mode: javascript

Copy Codes: Use Free Notepad ++
Bookmark and Share

Snap HTML Code Editor:
Paste the source code, make changes and instantly see it in live preview.
Snap HTML Code Editor

  About Copying
Copied To Clipboard!

<html> <head> <title>Content Switch Ticker Javascript Code Snippet</title> <style> BODY {font-family:verdana,arial,ms sans serif; font-size:90%;} #tic {border:.05em #CEC3AD solid; font-size:0.85em; padding:10px; width:400px; line-height:20px;} #tic * { /* this will hide all children tags */ font-size:1em; margin:0px; padding:0px; display:none;} #tic a { /* add more tags to this list if you wish to display them inside the children */ display:inline;} </style> <script>// <![CDATA[ /* // Begin Content Switch Ticker // == This Script Free To Use Providing This Notice Remains == // == This Script Has Been Found In The Free Public Codes Library == // == NOTICE: Though This Material May Have Been In A Public Depository, Certain Author Copyright Restrictions May Apply == // == Created by: James Crooke : : Creative Commons License == */ var list; // global list variable cache var tickerObj; // global tickerObj cache var hex = 255; function fadeText(divId) { if(tickerObj) { if(hex>0) { hex-=5; // increase color darkness"rgb("+hex+","+hex+","+hex+")"; setTimeout("fadeText('" + divId + "')", fadeSpeed); } else hex=255; //reset hex value } } function initialiseList(divId) { tickerObj = document.getElementById(divId); if(!tickerObj) reportError("Could not find a div element with id \"" + divId + "\""); list = tickerObj.childNodes; if(list.length <= 0) reportError("The div element \"" + divId + "\" does not have any children"); for (var i=0; i<list.length; i++) { var node = list[i]; if (node.nodeType == 3 && !/\S/.test(node.nodeValue)) tickerObj.removeChild(node); } run(divId, 0); } function run(divId, count) { fadeText(divId); list[count].style.display = "block"; if(count > 0) list[count-1].style.display = "none"; else list[list.length-1].style.display = "none"; count++; if(count == list.length) count = 0; window.setTimeout("run('" + divId + "', " + count+ ")", interval*1000); } function reportError(error) { alert("The script could not run because you have errors:\n\n" + error); return false; } var interval = 7; // interval in seconds var fadeSpeed = 40; // fade speed, the lower the speed the faster the fade. 40 is normal. // ]]> </script> </head> <body style="background-color:#ffffff;"> <div id="tic"> <h1>Welcome to Snapbuilder Free Public Codes Library ...</h1> <p> Snapbuilder is a division of Designer Wiz Web Productions located at</p> <p> All the code snippets found on this site are free for personal or business use.</p> <p> The only requirement is that you leave the credit information inside the script.</p> <h2>JavaScripts</h2> <p> JavaScript programs are contained within the HTML code of the Web page and are interpreted by the browser as it's read.</p> <p> JavaScript provides greater flexibility through such luxuries as being able to create windows, display moving text, sound or other multimedia elements with relative ease.</p> <h2>Some Basics</h2> <p> JavaScript is not Java; it is an object-based scripting language; and it is cross-platform. </p> </div> <script> <!-- initialiseList("tic"); //--> </script> <br /><br /> <p>This ticker works by displaying Web standards compliant HTML blocks of code.</p> <p>Formatting is accomplished with simple HTML and CSS.</p> <p>Adjust the STYLES to suit your needs.</p> <p>You can transfer the 'javascript' code to an external file to minify your page size.</p> </body> </html>

[ Snippet Options ]


© 2002 -  Snap Builder Public Codes Library