Version compl�te: jsB@nk » Texte » Rédaction » So-Ticker: POO JavaScript dynamique Ticker avec le typage de style
URL: https://www.javascriptbank.com/so-ticker-oop-javascript-dynamic-ticker-typing-styled.html
Cette JavaScript code example rend votre t?l?scripteurs de nouvelles d?roulants apparaissent comme ?tant tap?, mais c'est un effet am?lior? JavaScript, car il ne sera pas forcer les utilisateurs ? attendre des informations affich?es complet; c'est dire que chaque d?placement de la souris du temps aux utilisateurs plus alors je vais voir tous le titre imm?diatement
POO et DOM comp?tences, il est donc une r?f?rence tr?s utile pour les d?butants POO JavaScript
Simple JavaScript onClick saisie de texte
? JavaScript Saisie de texte 2
? JavaScript Typing Scroller
? JavaScript saisie de texte et Scroller
Version compl�te: jsB@nk » Texte » Rédaction » So-Ticker: POO JavaScript dynamique Ticker avec le typage de style
URL: https://www.javascriptbank.com/so-ticker-oop-javascript-dynamic-ticker-typing-styled.html
<style type="text/css">/* This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*/#so_oTickerContainer {width:700px;margin:auto;font:1.0em verdana,arial;background-color:lightyellow;border-top:1px solid yellow;border-bottom:1px solid yellow;}#so_oTickerContainer h1 {font:bold 0.9em verdana,arial;margin:0;padding:0;}.so_tickerContainer {position:relative;margin:auto;width:700px;background-color:lightyellow;border-top:1px solid yellow;border-bottom:1px solid yellow;}#so_tickerAnchor, #so_oTickerContainer a {text-decoration:none;color:black;font:bold 0.7em arial,verdana;border-right:1px solid #000;padding-right:2px;}#so_oTickerContainer a {border-style:none;}#so_oTickerContainer ul {margin-top:5px;}#so_tickerDiv {display:inline;margin-left:5px;}#so_tickerH1 {font:bold 1.0em arial,verdana;display:inline;}#so_tickerH1 a {text-decoration:none;color:#000;padding-right:2px;}#so_tickerH1 a img {border-style:none;}</style><script type="text/javascript">// Created by: Steve Chipman | http://slayeroffice.com//* This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*//****************************so_tickerversion 1.0last revision: [email protected] implementation instructions, see:http://slayeroffice.com/code/so_ticker/Should you improve upon or modify thiscode, please let me know so that I can updatethe version hosted at slayeroffice.Please leave this notice intact.****************************/so_ticker = new Object();so_ticker = {current:0,currentLetter:0,zInterval:null,tObj: null,op:0.95,pause: false,tickerContent: [],LETTER_TICK:100, FADE: 10, NEXT_ITEM_TICK: 3000, init:function() {var d=document;var mObj = d.getElementById("so_oTickerContainer");so_ticker.tObj = d.createElement("div");so_ticker.tObj.setAttribute("id","so_tickerDiv"); var h = d.createElement("h1");h.appendChild(d.createTextNode(so_ticker.getTextNodeValues(mObj.getElementsByTagName("h1")[0])));h.setAttribute("id","so_tickerH1");var ea = d.createElement("a");ea.setAttribute("href","javascript:so_ticker.showContent();");pImg = ea.appendChild(document.createElement("img"));pImg.setAttribute("src","plus.png");pImg.setAttribute("alt","Click to View all News Items.");ea.setAttribute("title","Click to View all News Items.");h.insertBefore(ea,h.firstChild);anchors = mObj.getElementsByTagName("a");var nObj = mObj.cloneNode(false);mObj.parentNode.insertBefore(nObj,mObj); mObj.style.display = "none";nObj.className = "so_tickerContainer"; nObj.setAttribute("id","so_nTickerContainer");nObj.appendChild(h); nObj.appendChild(so_ticker.tObj);so_ticker.getTickerContent();so_ticker.zInterval = setInterval(so_ticker.tick,so_ticker.LETTER_TICK); },showContent:function() {var d = document;d.getElementById("so_oTickerContainer").style.display = "block"; d.getElementById("so_nTickerContainer").style.display = "none";d.getElementById("so_oTickerContainer").getElementsByTagName("a")[0].focus();clearInterval(so_ticker.zInterval);},getTickerContent:function() {for(var i=0;i<anchors.length;i++) so_ticker.tickerContent[i] = so_ticker.getTextNodeValues(anchors[i]);}, getTextNodeValues:function(obj) {if(obj.textContent) return obj.textContent;if (obj.nodeType == 3) return obj.data;var txt = [], i=0;while(obj.childNodes[i]) {txt[txt.length] = so_ticker.getTextNodeValues(obj.childNodes[i]);i++;} return txt.join(""); }, tick: function() { var d = document; if(so_ticker.pause) { try { so_ticker.clearContents(d.getElementById("so_tickerAnchor")); d.getElementById("so_tickerAnchor").appendChild(d.createTextNode(so_ticker.tickerContent[so_ticker.current])); so_ticker.currentLetter = so_ticker.tickerContent[so_ticker.current].length; } catch(err) { } return; } if(!d.getElementById("so_tickerAnchor")) { var aObj = so_ticker.tObj.appendChild(d.createElement("a")); aObj.setAttribute("id","so_tickerAnchor"); aObj.setAttribute("href",anchors[so_ticker.current].getAttribute("href")); aObj.onmouseover = function() { so_ticker.pause = true; } aObj.onmouseout = function() { so_ticker.pause = false; } aObj.onfocus = aObj.onmouseover;aObj.onblur = aObj.onmouseout;aObj.setAttribute("title",so_ticker.tickerContent[so_ticker.current]); }d.getElementById("so_tickerAnchor").appendChild(d.createTextNode(so_ticker.tickerContent[so_ticker.current].charAt(so_ticker.currentLetter))); so_ticker.currentLetter++; if(so_ticker.currentLetter > so_ticker.tickerContent[so_ticker.current].length) { clearInterval(so_ticker.zInterval); setTimeout(so_ticker.initNext,so_ticker.NEXT_ITEM_TICK); } }, fadeOut: function() { if(so_ticker.paused) return; so_ticker.setOpacity(so_ticker.op,so_ticker.tObj); so_ticker.op-=.10; if(so_ticker.op<0) { clearInterval(so_ticker.zInterval); so_ticker.clearContents(so_ticker.tObj); so_ticker.setOpacity(.95,so_ticker.tObj); so_ticker.op = .95; so_ticker.zInterval = setInterval(so_ticker.tick,so_ticker.LETTER_TICK); } }, initNext:function() { so_ticker.currentLetter = 0, d = document; so_ticker.current = so_ticker.tickerContent[so_ticker.current + 1]?so_ticker.current+1:0; d.getElementById("so_tickerAnchor").setAttribute("href",anchors[so_ticker.current].getAttribute("href")); d.getElementById("so_tickerAnchor").setAttribute("title",so_ticker.tickerContent[so_ticker.current]); so_ticker.zInterval = setInterval(so_ticker.fadeOut,so_ticker.FADE); }, setOpacity:function(opValue,obj) { obj.style.opacity = opValue; obj.style.MozOpacity = opValue; obj.style.filter = "alpha(opacity=" + (opValue*100) + ")"; }, clearContents:function(obj) { try { while(obj.firstChild) obj.removeChild(obj.firstChild); } catch(err) { } }}function page_init(){so_ticker.init();}window.addEventListener?window.addEventListener("load",page_init,false):window.attachEvent("onload",page_init);</script><!--/* This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*/--><div id="so_oTickerContainer"><h1>Latest News:</h1><ul><li><a href="http://slayeroffice.com" rel="nofollow">Cat reported to have secured a fiddle.</a></li><li><a href="http://centricle.com" rel="nofollow">Cows: Able to leap orbiting satellites?</a></li><li><a href="http://adactio.com" rel="nofollow">People alarmed to hear small dog laughing.</a></li><li><a href="http://steve.ganz.name/blog/" rel="nofollow">Fork devastated as Spoon runs off with Dish.</a></li></ul></div>
/javascript/text/So_Ticker_OOP_JavaScript_Dynamic_Ticker_with_Typing_Styled/plus.png