ciao a tutti!
ho scaricato questo script dalla sezione js: http://javascript.html.it/script/ved...lling-banners/
ma avrei bisogno di far scrollare queste immagini in orrizontale e non in verticale...
qualcuno mi può aiutare?
le due pag di codice sono:
la pagina html:
e il file js:codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="it"> <head> <title>Banner scorrevoli - Esempio JavaScript scaricato da HTML.it</title> <meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" /> <meta http-equiv="Content-Language" content="it" /> <meta name="Robots" content="All" /> <meta name="Description" content="HTML.it - il sito italiano sul Web publishing" /> <meta name="Keywords" content="Ad ogni apertura di pagina questo script genera un differente colore di sfondo." /> <meta name="Owner" content="HTML.it srl" /> <meta name="Author" content="HTML.it srl" /> <meta name="Copyright" content="HTML.it srl" /> <style type="text/css"> #slideCont { margin: 10px; border: solid 1px #000; text-align: center; } #slideCont img { margin: 5px; } </style> <script type="text/javascript" src="banner.js"></script> </head> <body> <div id="slideCont" style="position:relative;z-index:1;width:140px;left:400px;overflow:hidden;"> <div id="slideA" style="position:absolute;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;"> [img]apache.gif[/img] [img]banner_haan_net_en.gif[/img] [img]linux.gif[/img] [img]mysql.gif[/img] [img]php.gif[/img] [img]ubuntu.gif[/img] <div id="slideB" style="position:relative;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;"> [img]apache.gif[/img] [img]banner_haan_net_en.gif[/img] [img]linux.gif[/img] [img]mysql.gif[/img] [img]php.gif[/img] [img]ubuntu.gif[/img] </div> </div> </div> <div align="center"> [img]logo_htmlit.gif[/img] <span style="font-size:80%; color:gray">sponsor</span> <script language="javascript" type="text/javascript"> <!-- var browName = navigator.appName; var SiteID = 1; var ZoneID = 24; var browDateTime = (new Date()).getTime(); if (browName=='Netscape') { document.write('<s'+'cript lang' + 'uage="jav' + 'ascript" src="http://adserver.html.it/a.aspx?ZoneID=' + ZoneID + '&Task=Get&IFR=False&Browser=NETSCAPE4&PageID=90264&SiteID=' + SiteID + '&Random=' + browDateTime + '">'); document.write('</'+'scr'+'ipt>'); } if (browName!='Netscape') { document.write('<s'+'cript lang' + 'uage="jav' + 'ascript" src="http://adserver.html.it/a.aspx?ZoneID=' + ZoneID + '&Task=Get&IFR=False&PageID=90264&SiteID=' + SiteID + '&Random=' + browDateTime + '">'); document.write('</'+'scr'+'ipt>'); } // --> </script> <noscript> <a href="http://adserver.html.it/a.aspx?ZoneID=24&Task=Click&Mode=HTML&SiteID=1&PageID=90264" target="_blank"></a> </noscript></div> </body> </html>
grazie!codice:/* This script and many more are available free online at The JavaScript Source!! http://javascript.internet.com */ /* ----------------------------------------------- Streaming banners - v.1.1 (c) 2006 www.haan.net contact: jeroen@haan.net You may use this script but please leave the credits on top intact. Please inform us of any improvements made. When useful we will add your credits. ------------------------------------------------ */ /* usage <body> <div id="slideCont" style="position:relative;z-index:1;width:140px;left:0px;overflow:hidden;"> <div id="slideA" style="position:absolute;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;"> your banners (images inside anchor tags) <div id="slideB" style="position:relative;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;"> your banners (images inside anchor tags) </div> </div> </div> </body> In order the have the script working in FireFox as well you need a proper "DTD" to prevent the browser's "quirksmode". Please see http://www.quirksmode.nl/ for more details. Or in case you experience problems, copy and paste next line on top of your webpage: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> */ function clip() { // width of the banner container var contWidth = 150; // height of the banner container var contHeight = 300; var id1 = document.getElementById('slideA'); var id2 = document.getElementById('slideB'); var height = id1.offsetHeight; id1.style.top = parseInt(id1.style.top)-1 + 'px'; document.getElementById('slideCont').style.height = contHeight + "px"; document.getElementById('slideCont').style.clip = 'rect(auto,'+ contWidth +'px,' + contHeight +'px,auto)'; id2.style.display = ''; if(parseFloat(id1.style.top) == -(height/2)) { id1.style.top = '0px'; } setTimeout(clip,50) } // Multiple onload function created by: Simon Willison // http://simon.incutio.com/archive/200...6/addLoadEvent function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } } } addLoadEvent(function() { clip(); });
Rispondi quotando
