Hallo!
Mal wieder ein kleines Problem:
habe einen Newsticker, dieser funktioniert in jedem Browser wie er soll, ausser, wie sollte man anders meinen, im InternetExplorer. Normalerweise bleibt er bei jedem Punkt stehen und scrollt dann weiter. Im IE scrollt er alle Punkte durch und bleibt erst dann stehen..
Hier der Code:
<script blabla>
var scroller;
scroller = new Scroller(document.getElementById('boundary'), document.getElementById('container'));
scroller.start();
</script>
<div style="position:relative; height: 130px; overflow:hidden; margin-top:5px;" id="boundary">
<div style="position:absolute;" id="container">
<div style="height: 150px" scrollDelay="4000">
Content 1
</div>
<div style="height: 150px" scrollDelay="4000">
Content 2
</div>
<div style="height: 150px" scrollDelay="4000">
Content 3
</div>
</div>
</div>
Die Funktionen der js-Datei:
var scrollers = new Array();
var scCount = 0;
function Scroller(bound, content) {
this.Id = ++scCount;
scrollers[this.Id] = this;
this.Bound = bound;
this.Content = content;
this.StartDelay = 500;
this.StepSize = 1;
this.StepDelay = 10;
this.Position = 500;
this.DelayPositions = new Array();
}
Scroller.prototype.start = function p_start() {
this.SecondContent = this.Content.cloneNode(true);
this.Bound.appendChild(this.SecondContent);
this.SecondContent.style.top = this.Content.offsetHeight;
window.setTimeout("_p_next(" + this.Id + ")", this.StartDelay);
for (var pos = 0; pos < this.Content.childNodes.length; pos++) {
var node = this.Content.childNodes[pos];
if (node.tagName) {
var delay = node.getAttribute("scrollDelay");
if (delay) {
this.DelayPositions[node.offsetTop] = delay;
}
}
}
}
Scroller.prototype.next = function p_start() {
if (this.Position == this.Content.offsetHeight) {
this.Position = 0;
var c = this.Content;
this.Content = this.SecondContent;
this.SecondContent = c;
this.SecondContent.style.clip = "rect(auto auto auto auto)";
this.Content.style.clip = "rect(auto auto auto auto)";
} else {
this.Position += this.StepSize;
}
var delay = this.StepDelay;
if (this.DelayPositions[this.Position]) {
delay = this.DelayPositions[this.Position];
}
if (this.Position > this.Content.offsetHeight) {
this.Position = this.Content.offsetHeight;
}
this.Content.style.clip = "rect(" + this.Position + " auto auto auto)";
this.Content.style.top = -this.Position;
this.SecondContent.style.top = this.Content.offsetHeight-this.Position;
window.setTimeout("_p_next(" + this.Id + ")", delay);
}
function _p_next(id) {
scrollers[id].next();
}