Log in

View Full Version : Can anyone help me please...


harisx
01-30-2006, 05:17 AM
What needs to be change to make the images scroll from left to right but still in a continuous loop with no space between the first and last image as the present.

to view example:

http://www.nenganggrek.com/nessypic/scrollertop.htm

here's the code:



<html>

<head>
<title>Scroller</title>
<Script>



var pic = new Array()

function banner(name, width, link){
this.name = name
this.width = width
this.link = link
}

pic[0] = new banner('thumb/70s-01.jpg',90,'nessy/70s-01.html')
pic[1] = new banner('thumb/70s-02.jpg',90,'nessy/70s-02.html')
pic[2] = new banner('thumb/70s-03.jpg',90,'nessy/70s-03.html')
pic[3] = new banner('thumb/80s-01.jpg',90,'nessy/80s-01.html')
pic[4] = new banner('thumb/80s-02.jpg',90,'nessy/80s-02.html')
pic[5] = new banner('thumb/travel-01.jpg',90,'nessy/travel-01.html')
pic[6] = new banner('thumb/travel-02.jpg',90,'nessy/travel-02.html')
pic[7] = new banner('thumb/travel-03.jpg',90,'nessy/travel-03.html')

var speed = 50

var kk = pic.length
var ii
var hhh
var nnn
var myInterval
var myPause


var imgArray = new Array(kk)
var myLeft = new Array(kk)

for (ii=0;ii<kk;ii++){
imgArray[ii] = new Image()
imgArray[ii].src = pic[ii].name
imgArray[ii].width = pic[ii].width

hhh=0
for (nnn=0;nnn<ii;nnn++){
hhh=hhh+pic[nnn].width
}
myLeft[ii] = hhh
}

function ready(){
for (ii=0;ii<kk;ii++){
if (document.images[ii].complete == false){
return false
break
}
}
return true
}


function startScrolling(){
if (ready() == true){
window.clearInterval(myPause)
myInterval = setInterval("autoScroll()",speed)
}
}


function autoScroll(){
for (ii=0;ii<kk;ii++){
myLeft[ii] = myLeft[ii] - 1

if (myLeft[ii] == -(pic[ii].width)){
hhh = 0
for (nnn=0;nnn<kk;nnn++){
if (nnn!=ii){
hhh = hhh + pic[nnn].width
}
}
myLeft[ii] = hhh
}



document.images[ii].style.left = myLeft[ii]
}
}


</Script>

<body bgcolor='#FFFDCF'>
<Script>
for (ii=0;ii<kk;ii++){
document.write('<a href = ' + pic[ii].link + ' target="main" ><img space=0 hspace=0 vspace=0 border=0 height=80px style=position:absolute;top:0;left:' + myLeft[ii] + '; src=' + pic[ii].name + '></a>')
}
myPause = setInterval("startScrolling()",3000)


</Script>



</body>

</html>
jscheuer1
01-30-2006, 07:41 AM
Quite a bit:


<html>

<head>
<title>Scroller</title>

<script type="text/javascript">

//==============================================
//Copyright. All rights reserved.
//Alexander Babichev
//Free for private use "as is" under a condition that a copyright notice is preserved.
//==============================================


var pic = new Array()

function banner(name, width, link){
this.name = name
this.width = width
this.link = link
}

pic[0] = new banner('thumb/70s-01.jpg',90,'nessy/70s-01.html')
pic[1] = new banner('thumb/70s-02.jpg',90,'nessy/70s-02.html')
pic[2] = new banner('thumb/70s-03.jpg',90,'nessy/70s-03.html')
pic[3] = new banner('thumb/80s-01.jpg',90,'nessy/80s-01.html')
pic[4] = new banner('thumb/80s-02.jpg',90,'nessy/80s-02.html')
pic[5] = new banner('thumb/travel-01.jpg',90,'nessy/travel-01.html')
pic[6] = new banner('thumb/travel-02.jpg',90,'nessy/travel-02.html')
pic[7] = new banner('thumb/travel-03.jpg',90,'nessy/travel-03.html')

var speed = 50

var kk = pic.length
var ii
var hhh
var nnn
var myInterval
var myPause
var limit=0
for (var i_tem = 0; i_tem < kk; i_tem++)
limit+=pic[i_tem].width


var imgArray = new Array(kk)
var myLeft = new Array(kk)

for (ii=0;ii<kk;ii++){
imgArray[ii] = new Image()
imgArray[ii].src = pic[ii].name
imgArray[ii].width = pic[ii].width

hhh=0
for (nnn=0;nnn<ii;nnn++){
hhh=hhh+pic[nnn].width
}
myLeft[ii] = hhh
}

function ready(){
for (ii=0;ii<kk;ii++){
if (document.images[ii].complete == false){
return false
break
}
}
return true
}


function startScrolling(){
if (ready() == true){
window.clearInterval(myPause)
myInterval = setInterval("autoScroll()",speed)
}
}


function autoScroll(){
for (ii=0;ii<kk;ii++){
myLeft[ii] = myLeft[ii] + 1

if (myLeft[ii] == limit)

myLeft[ii] = 0

document.images[ii].style.left = myLeft[ii]
}
}


</script>

<body bgcolor='#FFFDCF'>
<script type="text/javascript">

document.write('<div style="position:relative;left:-90px;overflow:hidden;width:'+limit+'px;height:80px;">')
for (ii=0;ii<kk;ii++){
document.write('<a href = ' + pic[ii].link + ' target="main" ><img space=0 hspace=0 vspace=0 border=0 height=80px style=position:absolute;top:0;left:' + myLeft[ii] + '; src=' + pic[ii].name + '></a>')
}
document.write('</div>')
myPause = setInterval("startScrolling()",3000)

</script>



</body>

</html>

Note: If you like the images appearing and disappearing, remove the lines marked in red.
harisx
01-30-2006, 08:47 AM
Thank You for Your help! it absolutely work now! :D