Autor |
Nachricht |
Errox
Threadersteller
Dabei seit: 04.08.2008
Ort: Braunschweig
Alter: -
Geschlecht:
|
Verfasst Mi 08.02.2012 12:49
Titel [jQuery Cycle] Slideshow in Slideshow wechseln zusammen |
|
|
Hej.
Sehr gerne arbeite ich mit diesem Plugin.
Und obwohl ich keine Ahnung von JS habe, komme ich gut zurecht
und kann kleine Modifizierungen super umsetzen.
Ich habe dieses mal eine Slideshow, in der Slideshows laufen.
Bild 1a [-> Bild 1b -> Bild 1c] -> Bild 2a [-> Bild 2b -> Bild 2c] -> Bild 3a [-> Bild 3b -> Bild 3c]
Bild 1, 2 und 3 werden per prev- und next-button gesteuert. Zu Bild 1b,
1c, 2b, 2c, etc. pp. gelangt man per Klick auf Bild 1a bzw. 2a oder 3a.
Funktioniert beinahe super.
Ich möchte nämlich nicht, dass wenn ich auf Bild 1a klicke und zu
Bild 1b gelange, dass eben auch Bild 2a und 3a zu 2b bzw. 3b wechseln.
Wie kann ich diese Verknüpfung untereinander unterbrechen,
ohne für jede Slideshow eine eigene class definieren zu müssen?
Code: | $(document).ready(function() {
$('.stage').cycle({
prev: '.button_prev',
next: '.button_next',
fx: 'scrollHorz',
timeout: 0,
speed: 1000,
});
});
$(document).ready(function() {
$('.object').cycle({
fx: 'fade',
timeout: 0,
speed: 'fast',
next: '.picture',
});
});
|
Code: | <div class="stage">
<!-- object --->
<div class="object">
<div class="picture" style="background: url(images/bild.jpg);">
<div class="details"><h6>Titel</h6><br /><span>Details</span></div>
</div>
<div class="picture" style="background: url(images/bild.jpg);">
<div class="details"><h6>Titel</h6><br /><span>Details</span></div>
</div>
<div class="picture" style="background: url(images/bild.jpg);">
<div class="details"><h6>Titel</h6><br /><span>Details</span></div>
</div>
</div>
<!-- object --->
<div class="object">
<div class="picture" style="background: url(images/bild.jpg);">
<div class="details"><h6>Titel</h6><br /><span>Details</div>
</div>
<div class="picture" style="background: url(images/bild.jpg);">
<div class="details"><h6>Titel</h6><br /><span>Details</span></div>
</div>
<div class="picture" style="background: url(images/bild.jpg);">
<div class="details"><h6>Titel</h6><br /><span>Details</span></div>
</div>
</div>
<!-- object --->
</div>
|
Liebe Grüße,
E.
|
|
|
|
|
Errox
Threadersteller
Dabei seit: 04.08.2008
Ort: Braunschweig
Alter: -
Geschlecht:
|
Verfasst Mo 13.02.2012 10:05
Titel
|
|
|
Zu schlecht erklärt?
Bräuchte wirklich Hilfe. Es ist schwer im Netz ein in etwa gleiches
Problem zu finden.
*push*
|
|
|
|
|
Anzeige
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Mo 13.02.2012 11:20
Titel
|
|
|
Kannst da ein Beispiel verlinken?
... sonst muss man sich das selbst erst zusammenbaun, bevor man was testen kann ^^
Vielleicht geht ja statt "next: '.picture'" sowas wie:
next: $(this).parents('div.object').find('.picture')
|
|
|
|
|
Errox
Threadersteller
Dabei seit: 04.08.2008
Ort: Braunschweig
Alter: -
Geschlecht:
|
Verfasst Mo 13.02.2012 11:47
Titel
|
|
|
Liegt nun auf meinem Uralt Webspace: Klick.
Schonmal Danke für deine Zeit!
|
|
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Mo 13.02.2012 13:11
Titel
|
|
|
Achso..
Dafür müssts wohl das Script umschreiben - kannst ja mal nen Request an den Autor schicken
Als Quick&Dirty-Lösung kannst halt für jeden "subblock" nen eigenen Aufruf angeben: Code: | $(document).ready(function() {
$('.stage').cycle({
prev: '.button_prev',
next: '.button_next',
fx: 'scrollHorz',
timeout: 0,
speed: 1000,
});
$('.object1').cycle({
fx: 'fade',
timeout: 0,
speed: 'fast',
next: $('.object1').find('.picture'),
});
$('.object2').cycle({
fx: 'fade',
timeout: 0,
speed: 'fast',
next: $('.object2').find('.picture'),
});
}); |
|
|
|
|
|
Errox
Threadersteller
Dabei seit: 04.08.2008
Ort: Braunschweig
Alter: -
Geschlecht:
|
Verfasst Mo 13.02.2012 13:47
Titel
|
|
|
Daran hatte ich auch schon gedacht. Das wollte ich eigentlich umgehen.
In diesem Forum wird, glaube ich, ein ähnliches Problem beschrieben.
Habe versucht den Code zu verstehen und auf meine Version anzuwenden.
Ist mir jedoch nicht gelungen. Da bin ich wohl auf dem Holzweg, richtig?
Ggf. vergebe ich eben doch mehrere Klassen
und lagere mein JS aus.
Es gibt keine feste Anzahl von Objekten,
aber wenn ich genügend Klassen vordefiniere,
dann wird es wohl auch so gehen.
Danke!
|
|
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Mo 13.02.2012 14:06
Titel
|
|
|
Ja da steht doch sogar ne andere schönere Lösung Code: | $('.object').each(function()
{
$(this).cycle({
fx: 'fade',
timeout: 0,
speed: 'fast',
next: $(this).find('.picture')
});
}); |
|
|
|
|
|
Errox
Threadersteller
Dabei seit: 04.08.2008
Ort: Braunschweig
Alter: -
Geschlecht:
|
Verfasst Mo 13.02.2012 14:24
Titel
|
|
|
Ah, wunderbar! Jetzt klappt's!
|
|
|
|
|
|
|
|
Ähnliche Themen |
Nach beendeter Slideshow zu Bildnummer wechseln
CSS Slideshow mit Zufall? (Header in dem Bilder wechseln)
JQuery Slideshow Problemchen
jquery slideshow mittig positionieren
Jquery Slideshow vom Inhalt differenzieren ?
[Jquery] Slideshow pausieren - mouse-over
|
|