ciao a tutti,
il mio intento è quello di creare un slideshow da piazzare nella testata del sito (larghezza 590x106.
in questo slideshow dovrebbero scorrere da dx a sx delle immagini 140x106px.
le immagini ovviamente sono caricate tutte su un db
attualmente ho uno script che mi fa vedere la prima immagine ma non passa alle successive, di conseguenza non si crea lo slideshow.
il codice che sto tentando è il seguente (lo scrip originale usa 2 slide ma io credo sia sufficiente una sola visto che le immagini del db saranno numerose)
1. DOVE STO SBAGLIANDO? PERCHè NON MI VISUALIZZA TUTTE LE IMMAGINI DEL DB?
2. È POSSIBILE CHE QUESTO BANNER SIA IN ORIZZONTALE ANZICCHé VERTICALE? QUALE è IL COMANDO DA SETTARE?
3. CI SONO ALTRE POSSIBILI SOLUZIONI?
Grazie, a presto: daniele.
PAGINA FOTO.ASP
PAGINA BANNER.JScodice:<% dim cn set cn = Server.CreateObject("ADODB.Connection") cn.connectionstring = "Provider=Microsoft.Jet.OLEDB.4.0;"&_ "Persist Security Info=False;"&_ "Data Source="& Server.MapPath("foto.mdb") cn.open() ' rileva tutte le immagini presenti nel DB sql = "SELECT * FROM foto" set rs = cn.execute(sql) %> <% do while not rs.eof %> <!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> <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]immagini/<%=Rs.Fields([/img]" width="140" height="106" border="0"> <!--[img]banner_haan_net_en.gif[/img] [img]linux.gif[/img] [img]mysql.gif[/img] [img]php.gif[/img] [img]ubuntu.gif[/img]--> <% rs.movenext() loop %> <!--<div id="slideB" style="position:relative;z-index:1;top:0px;left:0px;width:140px;overflow:hidden;"> [img]immagini/<%=Rs.Fields([/img]" width="126" height="44" border="0"> [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"> </script> <%Cn.Close()%> </body> </html>
codice:/* 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> */ function clip() { // width of the banner container var contWidth = 590; // height of the banner container var contHeight = 106; 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
