arraybreak
Erfahrenes Mitglied
Abend All,
ich habe hier ein Script zusammengestellt der meine 6 Bilder (die in einer reihe sind) durch ein zweites wechselt:
HTML:
Und der jQuery Code zur animation:
Mit Einstellungen "Timeout" und "Delay" wollte ich eigentlich diese Animation erreichen:
Wenn man die Seite betritt startet sich die animation erst in 5 sekunden -> EINS nach dem ANDEREN werden gewechselt --> Animation steht wieder 5 Sekunden .... und so immer wieder ...
Aber ich kriegs nicht hin, ich kriege die 5 Sekunden Pause nach letzten Bild nicht hin und nach einiger zeit wird die Animation asynchron. Was mache ich falsch?
Hier ist der Link zum jQuery Effekt: Cycle
arraybreak
ich habe hier ein Script zusammengestellt der meine 6 Bilder (die in einer reihe sind) durch ein zweites wechselt:
HTML:
PHP:
<div id="b1w">
<img src="images/1.jpg" width="120px" height="120px" style="border: 0px;"/>
<img src="images/7.jpg" width="120px" height="120px" style="border: 0px;" /></div>
<div id="b2w">
<img src="images/2.jpg" width="120px" height="120px" style="border: 0px;"/>
<img src="images/8.jpg" width="120px" height="120px" style="border: 0px;" /></div>
<div id="b3w">
<img src="images/3.jpg" width="120px" height="120px" style="border: 0px;"/>
<img src="images/9.jpg" width="120px" height="120px" style="border: 0px;" /></div>
<div id="b4w">
<img src="images/4.jpg" width="120px" height="120px" style="border: 0px;"/>
<img src="images/10.jpg" width="120px" height="120px" style="border: 0px;" /></div>
<div id="b5w">
<img src="images/5.jpg" width="120px" height="120px" style="border: 0px;"/>
<img src="images/11.jpg" width="120px" height="120px" style="border: 0px;" /></div>
<div id="b6w">
<img src="images/6.jpg" width="120px" height="120px" style="border: 0px;"/>
<img src="images/12.jpg" width="120px" height="120px" style="border: 0px;" /></div>
Und der jQuery Code zur animation:
PHP:
jQuery(document).ready(function() {
jQuery("#b1w").cycle({
fx: 'fade',
sync: false,
timeout: 5000,
delay: 5000
});
});
jQuery(document).ready(function() {
jQuery("#b2w").cycle({
fx: 'fade',
sync: false,
timeout: 5000,
delay: 6000
});
});
jQuery(document).ready(function() {
jQuery("#b3w").cycle({
fx: 'fade',
sync: false,
timeout: 5000,
delay: 7000
});
});
jQuery(document).ready(function() {
jQuery("#b4w").cycle({
fx: 'fade',
sync: false,
timeout: 5000,
delay: 8000
});
});
jQuery(document).ready(function() {
jQuery("#b5w").cycle({
fx: 'fade',
sync: false,
timeout: 5000,
delay: 9000
});
});
jQuery(document).ready(function() {
jQuery("#b6w").cycle({
fx: 'fade',
sync: false,
timeout: 5000,
delay: 10000
});
});
Mit Einstellungen "Timeout" und "Delay" wollte ich eigentlich diese Animation erreichen:
Wenn man die Seite betritt startet sich die animation erst in 5 sekunden -> EINS nach dem ANDEREN werden gewechselt --> Animation steht wieder 5 Sekunden .... und so immer wieder ...
Aber ich kriegs nicht hin, ich kriege die 5 Sekunden Pause nach letzten Bild nicht hin und nach einiger zeit wird die Animation asynchron. Was mache ich falsch?
Hier ist der Link zum jQuery Effekt: Cycle
arraybreak