JQuery Cycle Plugin zeigt die falschen Bilder

Question

Oh großes Forum,

Bitte helfen Sie! Ich habe ein Problem mit dem grundlegenden JQuery Cycle Plugin, wo ich Klassen für 3 unabhängige divs in einem Eltern/Wrapper div definiert habe. Jedes Div hat 3 Bilder, die spezifisch für die jeweiligen Eltern sind. Das Problem ist, dass das JQuery Cycle Plugin die Bilder in den falschen divs anzeigt !! Es wäre großartig, wenn jemand mir eine Lösung anbieten könnte, und eine Erklärung, warum dies geschieht. Wenn es einen Unterschied macht, arbeite ich in Wordpress. Hier ist die html:

<div class="gateway_img_containers clearfix"> 
    <div class="left_gateway_img_holder"> 
     <img src="<?php bloginfo('template_url'); ?>/images/position1_img_left.jpg" /> 
     <img src="<?php bloginfo('template_url'); ?>/images/position2_img_left.jpg" /> 
     <img src="<?php bloginfo('template_url'); ?>/images/position3_img_left.jpg" /> 
    </div> 
    <div class="middle_gateway_img_holder"> 
     <img src="<?php bloginfo('template_url'); ?>/images/position2_img_left.jpg" /> 
     <img src="<?php bloginfo('template_url'); ?>/images/position_2_img_middle.jpg" /> 
     <img src="<?php bloginfo('template_url'); ?>/images/position_2_img_right.jpg" /> 
    </div> 
    <div class="right_gateway_img_holder"> 
     <img src="<?php bloginfo('template_url'); ?>/images/position3_img_left.jpg" /> 
     <img src="<?php bloginfo('template_url'); ?>/images/position_3_img_middle.jpg" /> 
     <img src="<?php bloginfo('template_url'); ?>/images/position_3_img_right.jpg" /> 
    </div> 
</div> 

Und hier ist die JQuery:

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.cycle.all.js"></script> 


<script type="text/javascript"> 
    var $j = jQuery.noConflict(); 
    $j(document).ready(function(){ 
     $j('.left_gateway_img_holder').cycle(); 
    }); 
</script> 

<script type="text/javascript"> 
    var $j = jQuery.noConflict(); 
    $j(document).ready(function(){ 
     $j('.middle_gateway_img_holder').cycle(); 
    }); 
</script> 

<script type="text/javascript"> 
    var $j = jQuery.noConflict(); 
    $j(document).ready(function(){ 
     $j('.right_gateway_img_holder').cycle(); 
    }); 
</script> 

Kann ich einschränken, welche Bilder angezeigt werden, indem sie innerhalb des Zyklus spezifiziert()?

Lassen Sie mich wissen, wenn Sie weitere Informationen benötigen! thankx :)

Answer 1

<script type="text/javascript"> 
    var $j = jQuery.noConflict(); 
    $j(document).ready(function(){ 
     $j('.left_gateway_img_holder').cycle(); 
     $j('.middle_gateway_img_holder').cycle(); 
     $j('.right_gateway_img_holder').cycle(); 
    }); 
</script> 

Sie brauchen nicht difernts bereit Funktionen zu schreiben, versuchen relative Position und versteckten Überlauf auf alle Ihre divs