Plugin jQuery Cycle nie działa wewnątrz modalnego pudełka (Simple Modal Plugin)

Question

Zajmuję się tematem Wordpress, który otwiera nowe posty w polach modalnych zamiast oddzielnych stron.

Wtyczka obraz pokaz używam do wyświetlania obrazów na każde stanowisko (jQuery Cycle Plugin) działa świetnie, gdy poczta jest na osobnej stronie, ale podczas korzystania z wtyczki Simple Modal, obrazy są wyświetlane na liście zamiast pokazu slajdów , całkowicie łamiąc mój układ.

Oto co post wygląda na własną rękę (kliknij obraz, aby przejść slajdów): http://cl.ly/240c3C0i1m1o

Można kliknąć na pierwszej miniaturki na tej stronie zobaczyć, jak modalne prace (nie mam zakodowane w unikalny URL w przypadku modals): http://cl.ly/3A2J1V2q1T0P

Zakładam, że wtyczka jQuery Cycle nie działa w polu modalnym, ponieważ stosuje się do strony przed załadowaniem treści modalnej, klikając łącze? Naprawdę nie wiem.

Każda pomoc będzie mile widziana. Użyłem tej odpowiedzi, aby pomóc mi zaimplementować modalne pudełko: Using simplemodal with wordpress. Poniżej zamieściłem odpowiedni kod z mojego tematu.

Jest to w moim pliku header.php:

<?php 
     wp_enqueue_script('jquery.cycle.all.min.js', '/wp-content/themes/Goaty%20Tapes%20Theme/js/jquery.cycle.all.min.js', array('jquery')); 
     wp_enqueue_script('product-slideshow', '/wp-content/themes/Goaty%20Tapes%20Theme/js/product-slideshow.js'); 
?> 

to co jest zawarte w product-slideshow.js (inicjuje ustawienia wtyczki cykl):

$(document).ready(function() { $('.product-images').cycle({ 
    fx:  'none', 
    next: '.slide', 
    timeout: 0 
}); }); 

mam to w functions.php aby uzyskać Modalne do pracy:

function my_print_scripts() { 
     if (!is_admin()) { 
      $url = get_bloginfo('template_url'); 
      wp_enqueue_script('jquery-simplemodal', 'http://66.147.244.226/~goatytap/wp-content/themes/Goaty%20Tapes%20Theme/js/jquery.simplemodal.1.4.1.min.js', array('jquery'), '1.4.1', true); 
      wp_enqueue_script('my_js', 'http://66.147.244.226/~goatytap/wp-content/themes/Goaty%20Tapes%20Theme/js/site.js', null, '1.0', true); 
     } 
    } 
    add_action('wp_print_scripts', 'my_print_scripts'); 

To jest moje site.js file:

jQuery(function ($) { 
    $('a.popup').click(function(){ 
     id = this.rel; 
     $.get('http://66.147.244.226/~goatytap/ajax-handler/?id='+id, function (resp) { 
      var data = $('<div id="ajax-popup"></div>').append(resp); 
      // remove modal options if not needed 
      data.modal({ 
       overlayCss:{backgroundColor:'#FFF'}, 
       containerCss:{backgroundColor:'#fff'} 
      }); 
     }); 
     return false; 
    }); 
}); 

Answer 1

Inicjujesz cykl na gotowym dokumencie. Musisz zainicjować na pokazie modalnym.

Sprawdź ich documentation

onShow [Function:null] 
The callback function used after the modal dialog has opened 

coś takiego

data.modal({ 
      overlayCss:{backgroundColor:'#FFF'}, 
      containerCss:{backgroundColor:'#fff'}, 
      onShow: function (dialog) { 
       $('.product-images').cycle({ 
        fx:  'none', 
        next: '.slide', 
        timeout: 0 
       }); 

      } 
     });