2-е бегущие строки на одной странице
Написал скрипт бегущей строки:
// The document is loaded -->
onload = function()
{
runingLine.iterator();
}
// -->
var runingLine = {};
runingLine.info = [
['RunLineLrt', 50, 'ltr'],
//['RunLineRtl', 50, 'rtl']
];
runingLine.iterator = function() {
for (var i=0; i<runingLine.info.length; i++){
var val_1 = runingLine.info[i][0];
var val_2= runingLine.info[i][1];
var val_3 = runingLine.info[i][2];
runingLine.initial(val_1, val_2, val_3);
}
}
// RuningLine initialization -->
runingLine.initial = function (id, value, direction) { // direction can be 'ltr' or 'rtl' -->
obj = document.getElementById(id);
wrapper = obj.parentNode;
speed = Math.round(1000/value); // quantity of pixels in a second -->
obj.style.visibility = 'visible';
if (direction == 'ltr') {
posStart = wrapper.offsetWidth; // start coordinate -->
posFinish = -(obj.offsetWidth); // finish coordinate -->
runingLine.traffic.ltr();
}
else if (direction == 'rtl') {
posStart = -(obj.offsetWidth); // start coordinate -->
posFinish = wrapper.offsetWidth; // finish coordinate -->
runingLine.traffic.rtl();
}
obj.onmouseover = function() {
clearTimeout(timer);
}
obj.onmouseout = function() {
if (direction == 'ltr') {
runingLine.traffic.ltr();
}
else if (direction == 'rtl') {
runingLine.traffic.rtl();
}
}
}
runingLine.traffic = new Traffic();
function Traffic() {
// RuningLine traffic 'left to right' -->
this.ltr = function() {
if (posStart >= posFinish) {
posStart-=1; // change coordinate -->
obj.style.left = posStart+'px';
timer = setTimeout(arguments.callee, speed);
}
else {
posStart = wrapper.offsetWidth; // start coordinate -->
posFinish = -(obj.offsetWidth); // finish coordinate -->
runingLine.traffic.ltr();
}
}
// -->
// RuningLine traffic 'right to left' -->
this.rtl = function() {
if (posStart <= posFinish) {
posStart+=1; // change coordinate -->
obj.style.left = posStart+'px';
timer = setTimeout(arguments.callee, speed);
}
else {
posStart = -(obj.offsetWidth); // start coordinate -->
posFinish = wrapper.offsetWidth; // finish coordinate -->
runingLine.traffic.rtl();
}
}
// -->
}
Инициализирую вот так:
runingLine.info = [
['RunLineLrt', 50, 'ltr'],
//['RunLineRtl', 50, 'rtl']
];
Решил делать через массив и потом в цикле выхывать строки - не получается. Когда строка одна - всё работает. Как тоько их нужно сделать больше - не знаю как? Каков принцип таких задач? Где об этом можно почитать?
Спасибо. |