Buongiorno a tutti,
desideravo chiedervi se qualcuno possa gentilmente aiutarmi con questo script per lo scorrimento orizzontale di immagini linkabili. Le immagini partono da destra e vanno a riempire la striscia scorrendo verso sinistra. Quando il ciclo finisce, ricomincia, con l'ultima immagine che scompare a sinistra e la prima che riappare a destra. Io invece avrei bisogno che quando si carica la pagina la striscia compaia subito caricata con le immagini e poi cominci a scorrere, per non avere la fila vuota che si riempie gradualmente, e che quando finisce l'ultima e riprende il ciclo, l'ultima sia subito dietro attaccata... La striscia è larga 900px e va sotto l'header della mia home page, quindi devono apparire subito le immagini, altrimenti si carica vuota e non sta bene...
Se allego lo script qualcuno potrebbe gentilmente, con calma quando ha tempo, dargli un'occhiata e spiegarmi se è fattibile questa modifica?
Vi ringrazio davvero moltissimo!
Script:
<script type="text/javascript">
// Image Scroller 2.03 with double-fade effect
// By Peter Gehrig
// Copyright (c) 2003 Peter Gehrig. All rights reserved.
// Permission given to use the script provided that this notice remains as is.
// URLs of slides
var slideurl=new Array("pic1.jpg","pic2.jpg","pic3.jpg","pic4.jpg")
// comments displayed below the slides
var slidecomment=new Array("Mary","Jane","Rita","Tina")
// links for each slide
var slidelink=new
Array()
// targets of the links. Allowed values: "_parent", "_top", "_blank", "_self"
var slidetarget=new Array("_blank","_blank","_blank","_blank")
// the width of the slideshow (pixels)
var scrollerwidth=900
// the height of the slideshow (pixels)
var scrollerheight=120
// width of the transparent zones (pixels)
var translayerszone=40
// font-attributes for the comments
var slidefont="Arial"
var slidefontcolor="blue"
var slidefontsize="2"
// background-color of webpage
var pagebgcolor="#FFFFFF"
// do not edit below this line
var translayerswidth=1
var translayersmax=Math.floor(translayerszone/translayerswidth)
var translayersleftpos=0
var translayersopacity=100
var translayersfactor=100/translayersmax
var translayerswidthall=translayersmax*translayerswidt h
var allpicturewidth
var distancepictopic=0
var scrollerleft=0
var scrollertop=0
var pause=20
var step=2
var newstep=step
var clipleft,clipright,cliptop,clipbottom
var i_picture=0
var timer
var picturecontent=""
var ns4=document.layers?1:0
var ns6=document.getElementById&&!document.all?1:0
var ie=document.all?1:0
var browserinfos=navigator.userAgent
var opera=browserinfos.match(/Opera/)
var preloadedimages=new Array()
for (i=0;i<slideurl.length;i++){
preloadedimages[i]=new Image()
preloadedimages[i].src=slideurl[i]
}
function init() {
if (ie) {
allpicturewidth=document.all.picturediv.offsetWidt h
document.all.picturediv.style.posTop=scrollertop
document.all.picturediv.style.posLeft=scrollerleft +scrollerwidth
clipleft=0
clipright=0
cliptop=0
clipbottom=scrollerheight
document.all.picturediv.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
document.all.picturediv.style.visibility="visible"
scrollpicture()
}
if (ns6) {
allpicturewidth=document.getElementById('emptypict urediv').offsetWidth
document.getElementById('picturediv').style.top=sc rollertop
document.getElementById('picturediv').style.left=s crollerleft+scrollerwidth
clipleft=0
clipright=0
cliptop=0
clipbottom=scrollerheight
document.getElementById('picturediv').style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
document.getElementById('picturediv').style.visibi lity="visible"
scrollpicture()
}
if (ns4) {
allpicturewidth=document.roof.document.picturediv. document.width
document.roof.document.picturediv.top=scrollertop
document.roof.document.picturediv.left=scrollerlef t+scrollerwidth
document.roof.document.picturediv.clip.left=0
document.roof.document.picturediv.clip.right=0
document.roof.document.picturediv.clip.top=0
document.roof.document.picturediv.clip.bottom=scro llerheight
document.roof.document.picturediv.visibility="visi ble"
scrollpicture()
}
}
function scrollpicture() {
if (ie) {
if (document.all.picturediv.style.posLeft>=scrollerle ft-allpicturewidth) {
document.all.picturediv.style.posLeft-=step
clipright+=step
if (clipright>scrollerwidth) {
clipleft+=step
}
document.all.picturediv.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
var timer=setTimeout("scrollpicture()",pause)
}
else {
resetposition()
}
}
if (ns6) {
if (parseInt(document.getElementById('picturediv').st yle.left)>=scrollerleft-allpicturewidth) {
document.getElementById('picturediv').style.left=p arseInt(document.getElementById('picturediv').styl e.left)-step
clipright+=step
if (clipright>scrollerwidth) {
clipleft+=step
}
document.getElementById('picturediv').style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
var timer=setTimeout("scrollpicture()",pause)
}
else {
resetposition()
}
}
if (ns4) {
if (document.roof.document.picturediv.left>=scrollerl eft-allpicturewidth) {
document.roof.document.picturediv.left-=step
document.roof.document.picturediv.clip.right+=step
if (document.roof.document.picturediv.clip.right>scro llerwidth) {
document.roof.document.picturediv.clip.left+=step
}
var timer=setTimeout("scrollpicture()",pause)
}
else {
resetposition()
}
}
}
function onmsover() {
step=0
}
function onmsout() {
step=newstep
}
function resetposition() {
if (ie) {
document.all.picturediv.style.posLeft=scrollerleft +scrollerwidth
clipleft=0
clipright=0
document.all.picturediv.style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
scrollpicture()
}
if (ns6) {
allpicturewidth=document.getElementById('emptypict urediv').offsetWidth
document.getElementById('picturediv').style.left=s crollerleft+scrollerwidth
clipleft=0
clipright=0
document.getElementById('picturediv').style.clip ="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")"
scrollpicture()
}
if (ns4) {
document.roof.document.picturediv.left=scrollerlef t+scrollerwidth
document.roof.document.picturediv.clip.left=0
document.roof.document.picturediv.clip.right=0
scrollpicture()
}
}
picturecontent=""
picturecontent+="<table cellpadding=2 cellspacing=0>"
picturecontent+="<tr>"
for (i=0;i<=slideurl.length-1;i++) {
picturecontent+="<td>"
picturecontent+="<a href=\""+slidelink[i]+"\" target=\""+slidetarget[i]+"\" onMouseOver=\"javascriptnmsover()\" onMouseOut=\"javascript
picturecontent+="<img src=\""+slideurl[i]+"\" border=0></a>"
picturecontent+="</td>"
}
picturecontent+="</tr>"
picturecontent+="<tr>"
for (i=0;i<=slideurl.length-1;i++) {
picturecontent+="<td>"
picturecontent+="<font face=\""+slidefont+"\" color=\""+slidefontcolor+"\" size="+slidefontsize+">"
picturecontent+=slidecomment[i]
picturecontent+="</font>"
picturecontent+="</td>"
}
picturecontent+="</tr>"
picturecontent+="</tr></table>"
if (ie || ns6) {
document.write('<div style="position:relative;width:'+scrollerwidth+'px ;height:'+scrollerheight+'px;overflow:hidden">')
document.write('<div id="picturediv" style="position:absolute;top:0px;left:0px;height:' +scrollerheight+'px;visibility:hidden">'+pictureco ntent+'</div>')
if (ie && !opera) {
for (i=0;i<=translayersmax;i++) {
document.write('<span ID="trans'+i+'" style="position:absolute;top:0px;left:'+translayer sleftpos+'px;width:'+translayerswidth+'px;height:' +scrollerheight+'px;background-color:'+pagebgcolor+';filter:alpha(opacity='+trans layersopacity+');overflow:hidden"> </span>')
translayersleftpos+=translayerswidth
translayersopacity-=translayersfactor
}
translayersleftpos=scrollerwidth-translayersleftpos
for (ii=0;ii<=translayersmax;ii++) {
document.write('<span ID="trans'+ii+'" style="position:absolute;top:0px;left:'+translayer sleftpos+'px;width:'+translayerswidth+'px;height:' +scrollerheight+'px;background-color:'+pagebgcolor+';filter:alpha(opacity='+trans layersopacity+');overflow:hidden"> </span>')
translayersleftpos+=translayerswidth
translayersopacity+=translayersfactor
}
}
if (ns6 && !opera) {
for (i=0;i<=translayersmax-1;i++) {
document.write('<span ID="transleft'+i+'" style="position:absolute;top:0px;left:'+translayer sleftpos+'px;width:'+translayerswidth+'px;height:' +scrollerheight+'px;background-color:'+pagebgcolor+';-moz-opacity:'+translayersopacity/100+';overflow:hidden"> </span>')
translayersleftpos+=translayerswidth
translayersopacity-=translayersfactor
if (translayersopacity<0) {translayersopacity=0.001}
}
translayersleftpos=scrollerwidth-translayersleftpos
translayersopacity=0.001
for (i=0;i<=translayersmax-1;i++) {
document.write('<span ID="transright'+i+'" style="position:absolute;top:0px;left:'+translayer sleftpos+'px;width:'+translayerswidth+'px;height:' +scrollerheight+'px;background-color:'+pagebgcolor+';-moz-opacity:'+translayersopacity/100+';"> </span>')
translayersleftpos+=translayerswidth
translayersopacity+=translayersfactor
}
}
document.write('</div>')
document.write('<div id="emptypicturediv" style="position:absolute;top:0px;left:0px;height:' +scrollerheight+'px;visibility:hidden">'+pictureco ntent+'</div>')
window.onload=init
}
if (ns4) {
document.write('<ilayer name="roof" width='+scrollerwidth+' height='+scrollerheight+'>')
document.write('<layer name="picturediv" width='+scrollerwidth+' height='+scrollerheight+' visibility=hide>'+picturecontent+'</layer>')
document.write('</ilayer>')
window.onload=init
}
</script>
Rispondi quotando