Michele Basso
a- a+

Barra dinamica per le news

Con questo DHTML possiamo creare una barra con le news chevengano visualizzate automaticamente, una dopol'altra. 

VISUALIZZA L'ESEMPIO

Per utilizzare lo script, basterà inserire il seguentecodice all'interno del tag body:

<style><!--.scrollerstyle{font-family:webdings;background:#FFFFFF;border:1px solid #000000;cursor:hand;}--></style><script language="javascript">// Bar script- By Premshree Pillai (premshree@hotmail.com)//http://www.qiksearch.com/javascripts.htm//Enhancements by Dynamic Drive//Visit http://www.dynamicdrive.com for this script var msgs = new Array(     "Click here to go back to Dynamic Drive" ,     "JavaScript Kit- free scripts and tutorials" ,     "Freewarejava.com" ,     "Wired News- Technology and beyond" ,     "Qiksearch.com" ); // No comma after last ticker msg var msg_url = new Array(     "http://www.dynamicdrive.com" ,     "http://www.javascriptkit.com" ,     "http://freewarejava.com" ,     "http://www.wired.com" ,     "http://www.qiksearch.com" ); // No comma after last ticker urlvar barwidth=350 //Enter main bar width in px or %var setdelay=3000 //Enter delay between msgs, in mili-secondsvar mouseover_color='#E1FFE1' //Specify highlight colorvar mouseout_color='#FFFFFF' //Specify default color/////////////////////////////////////////////////////////////////////var count=0;var ns6=document.getElementById&&!document.allvar ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1if (ie4||ns6){document.write('<form name="news_bar"><input type="button" value="3" onclick="moveit(0)" class="scrollerstyle" style="width:22; height:22; border-right-width:0px;" name="prev" title="Previous News"><input type="button" name="news_bar_but" onclick="goURL();" style="color:#000000;background:#FFFFFF; width:'+barwidth+ '; height:22; border-width:1; border-color:#000000; cursor:hand" onmouseover="this.style.background=mouseover_color" onmouseout="this.style.background=mouseout_color"><input type="button" value="4" onclick="moveit(1)" class="scrollerstyle" style="width:22; height:22; border-left-width:0px;" name="next" title="Next News"></form>');}else{document.write('<form name="news_bar"><input type="button" value="Previous" onclick="moveit(0)">')if (navigator.userAgent.indexOf("Opera")!=-1)document.write('<input type="button" name="news_bar_but" onclick="goURL();" style="width:'+barwidth+ '" border="0">')elsedocument.write('<input type="button" name="news_bar_but" onclick="goURL();" width="'+barwidth+ '" border="0">')document.write('<input type="button" value="Next" onclick="moveit(1)"></form>')}function init_news_bar(){  document.news_bar.news_bar_but.value=msgs[count];}//moveit function by Dynamicdrive.comfunction moveit(how){if (how==1){ //cycle fowardif (count<msgs.length-1)count++elsecount=0}else{ //cycle backwardif (count==0)count=msgs.length-1elsecount--}document.news_bar.news_bar_but.value=msgs[count];}setInterval("moveit(1)" ,setdelay)function goURL(){ location.href=msg_url[count];}init_news_bar();</script>

Per modificare le news e i link ad esse associati,basterà modificare lo script, che contiene tutti icommenti e le indicazioni riguardo alla modifica del codice.

Per problemi relativi all'utilizzo di questo DHTML,consultate il nostro forum.



Ti potrebbe interessare anche

commenta la notizia