Expand Ticker

Dieser tolle Textticker ist unendlich erweiterbar und kann ausser Text auch Links und Grafiken darstellen. Durch CSS kann es der eigenen Homepage leicht angepasst werden.

Durch den Klick auf den [Expanieren] werden die Themen, die im Ticker stehen vorab mit 30 Zeichen angezeigt.

Die Laufzeit pro Nachricht kann ebenfalls eingestellt werden und beträgt in diesem Beispiel 4 Sekunden.

Dieses Script läuft auf folgenden Browsern:
	Internet Explorer
	Mozilla Firefox
getestet jeweils mit der aktuellen Version

HTML-Einbindung
   <style>  </style>  <script language="JavaScript1.2"> /*********************************************** * George's Expandable Ticker- © Dynamic Drive (www.dynamicdrive.com) * This notice must stay intact for use * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ //configure tickercontents[] to set the messges you wish be displayed (HTML codes accepted) var tickercontents=new Array() tickercontents[0]='java24.net - DIE Javascript-Ressource, mit über 700 (!!) Scripten und Applets eine der größten deutschsprachigen Internetseiten zum Thema Javascript!!' tickercontents[1]='DER java24.net-Newsletter, alle 14 Tage topaktuelle Informationen rund um Javascript, Javaapplets und HTML. <a href="http://www.abo.java24.net">Anmeldung</a>' tickercontents[2]='Hier kann noch ein dritter Text stehen' tickercontents[3]='Außerdem gibt es noch Platz für einen vierten Text' tickercontents[4]='Außerdem gibt es noch Platz für einen fünften Text' tickercontents[5]='Wir wäre es mit einer Grafik: <img src="http://www.java24.net/gif/banner_88_31.gif">' tickercontents[6]='Außerdem gibt es noch Platz für einen siebten Text' //specify how many characters of a message (for each msg) to show in expanded menu: var charslimit=30 //Below specifies the "expand text". Do not remove onClick=".." portion. var expandtext='<a href="#" onClick="dropdownit(event);return false">Expandieren</a> <img src="tridown.gif" border=0>' //configure below variables to set dimensions and main color of the ticker var tickerwidth='275px' var tickerheight='100px' //not including "Expand" text var tickerbgcolor='#dedfd5' //configure the below variable to determine the delay between ticking of messages (in miliseconds) var tickdelay=4000 ////Do not edit pass this line//////////////// var ie4=document.all || navigator.userAgent.search(/opera.7/i)!=-1 //lump Opera 7 with IE var ns6=document.getElementById && !document.all && !window.opera var ns4=document.layers if (ns4){ expandtext=expandtext.replace(/dropdownit\(event\); *return false/gi, "return dropdownitNS4(event,this)") tickerheightNS4=parseInt(tickerheight)+19 tickerlistheightNS4=tickerheight } var currentmessage=0 var tickercontentstotal='' if (ie4||ns6) //OUTPUT DROP DOWN MENU document.write('<div id="tickerexpand" class="expandmenu" style="visibility:hidden"></div>') function rotatecontent(){ if (ns4){ //OUTPUT HTML for ticker area for NS4 tickerobj.document.tickernssub.document.write(tickercontents[currentmessage]+'') tickerobj.document.tickernssub.document.close() } else if (ie4||ns6){ tickerobj.innerHTML=tickercontents[currentmessage] previousmessage=(currentmessage==0)? tickercontents.length-1 : currentmessage-1 tickerexpand_item=ns6? document.getElementById("expand"+currentmessage) : eval("expand"+currentmessage) tickerexpand_previousitem=ns6? document.getElementById("expand"+previousmessage) : eval("expand"+previousmessage) tickerexpand_previousitem.className="" tickerexpand_item.className="expandmenu_highlight" } currentmessage=(currentmessage==tickercontents.length-1)? 0 : currentmessage+1 rotatemsgtimer=setTimeout("rotatecontent()",tickdelay) } function dropdownit(e){ if (ns6) e.stopPropagation() else e.cancelBubble=true tickerexpandobj.style.visibility=tickerexpandobj.style.visibility=="hidden"? "visible" : "hidden" expandbuttonLeft=ns6? e.pageX-e.layerX : document.body.scrollLeft+event.clientX-event.offsetX expandbuttonTop=ns6? e.pageY-e.layerY : document.body.scrollTop+event.clientY-event.offsetY tickerexpandobj.style.left=expandbuttonLeft+"px" tickerexpandobj.style.top=expandbuttonTop+expandbuttonobj.offsetHeight-3+"px" } function dropdownitNS4(e, currentobj){ tickerexpandobj.left=tickerobj.pageX tickerexpandobj.top=tickerobj.pageY+parseInt(tickerlistheightNS4)+tickerobj.document.expandbuttonNS4.document.height tickerexpandobj.visibility=(tickerexpandobj.visibility=="hide")? "show" : "hide" return false } function jumptomsg(whichmsg){ clearTimeout(rotatemsgtimer) if (ie4||ns6) tickerexpand_item.className="" currentmessage=whichmsg rotatecontent() } function initialize_ticker(){ if (ns4) document.tickernsmain.visibility="show" tickerobj=ie4? tickerlist : ns6? document.getElementById("tickerlist") : ns4? document.tickernsmain : "" tickerexpandobj=ie4? tickerexpand : ns6? document.getElementById("tickerexpand") : ns4? document.expandlayer : "" expandbuttonobj=ie4? expandbutton : ns6? document.getElementById("expandbutton") : "" for (i=0;i<tickercontents.length;i++){ //get total scroller contents tempstringcontainer=tickercontents[i].replace(/\<[^\>]+\>/g, ''); //remove HTML tags tickercontentstotal+='<div id="expand'+i+'">- <a href="javascript:jumptomsg('+i+')">'+tempstringcontainer.substring(0, charslimit)+'...</a></div>' } if (ie4||ns6){ tickerexpandobj.innerHTML=tickercontentstotal expandbuttonobj.innerHTML=expandtext document.onclick=function(){ tickerexpandobj.style.visibility="hidden" } } else if (ns4){ tickerexpandobj.document.write(tickercontentstotal) tickerexpandobj.document.close() tickerexpandobj.clip.width=parseInt(tickerwidth)*0.9 tickerobj.document.expandbuttonNS4.document.write(expandtext) tickerobj.document.expandbuttonNS4.document.close() tickerexpandobj.captureEvents(Event.CLICK) tickerexpandobj.onclick=function(){ tickerexpandobj.visibility="hide" } } rotatecontent() } if (ie4||ns6) //OUT HTML FOR TICKER AREA for IE/NS6 document.write('<table id="tickerarea" border="0" style="width:'+tickerwidth+';" bgcolor="'+tickerbgcolor+'" cellspacing="0" cellpadding="0"><tr><td id="tickerlist" width="100%" height="'+tickerheight+'" style="padding-left:3px" valign="top"></td></tr><tr><td width="90%"><div id="expandbutton" style="position:relative"></div></td></tr></table>') window.onload=initialize_ticker </script>

Hier kannst Du Dir das Javascript einfach per eMail zusenden lassen.

Mail:

Name:

Abo
Wenn Du den Newsletter beziehen möchtest, klicke bitte in das Feld "Abo"