2011-06-28 10 views
0

jQueryのfancyboxで2回のクリックが必要なのはなぜですか?

<script type="text/javascript"> 
    jQuery(document).ready(function() { 
     jQuery("a.fancybox_videojs").click(function(e) { 
      e.preventDefault(); 

      var url = jQuery(this).attr('title'); 
      var rel = jQuery(this).attr('rel'); 
      var img = jQuery(this).children('img').attr('src'); 

      jQuery(this).fancybox({ 
       'overlayOpacity' : <?php echo get_option('fancybox_overlayOpacity'); ?>, 
       'overlayColor' : '<?php echo get_option('fancybox_overlayColor'); ?>', 
       'hideOnContentClick' : false, 
       'content': '<div><div class="video-js-box vim-css">' + 
           '<video id="example_video_1" class="video-js" width="650" height="370" controls="controls" preload="auto" poster="' + img + '">' + 
           [...omitted...] 
           '</video>' + 
           '</div></div>', 
       'titleShow' : false, 
       'onComplete': function() { 
        jQuery("#fancybox-inner").css({ 'overflow': 'hidden' }); 
        VideoJS.setupAllWhenReady(); 
       }, 
       'onClosed': function() { jQuery("#fancybox-inner").empty(); } 
      }); 
     }); 
    }); 
    </script> 

HTML

<div class="content-wrap container_12"> 
    <div class="work_cat alpha"> 
    <a href="" id="##"></a> 
    </div> 
    <div class="work_col"> 
    <div class="work_cell" id="thumb_##"> 
     <a class="fancbox_videojs" href="" title="" rel=""><img src=""></a> 
     <a class="fancbox_videojs" href="" title="" rel=""></a> 
    </div> 
    </div> 
    <div class="work_col"></div> 
    <div class="work_col omega"></div> 
</div> 

私はここで2つの問題があります。

  1. ファンシーボックスを表示するには2回のクリックが必要です。
  2. 私は.work_cat内のリンクもfancyboxを持って帰りたいと思うが、それはそれは長すぎるではないでしょうので、私はjQueryのコードの一部を省略しcoresponding .work_cell

から変数を取得する必要があります。あなたがそれを見なければならない場合、私はそれを投稿します

答えて

4

fancyboxがクリックで動作します。

(あなたがそれをしたいすべての場所にfancyboxを添付)の代わりにこれを試してみてください:

jQuery("a.fancybox_videojs").click(function(){return false;}) 
    .each(function(i,item) { 
     var url = jQuery(this).attr('title'); 
     var rel = jQuery(this).attr('rel'); 
     var img = jQuery(this).children('img').attr('src'); 

     jQuery(this).fancybox({ 
      'overlayOpacity' : <?php echo get_option('fancybox_overlayOpacity'); ?>, 
      'overlayColor' : '<?php echo get_option('fancybox_overlayColor'); ?>', 
      'hideOnContentClick' : false, 
      'content': '<div><div class="video-js-box vim-css">' + 
          '<video id="example_video_1" class="video-js" width="650" height="370" controls="controls" preload="auto" poster="' + img + '">' + 
          [...omitted...] 
          '</video>' + 
          '</div></div>', 
      'titleShow' : false, 
      'onComplete': function() { 
       jQuery("#fancybox-inner").css({ 'overflow': 'hidden' }); 
       VideoJS.setupAllWhenReady(); 
      }, 
      'onClosed': function() { jQuery("#fancybox-inner").empty(); } 
     }); 
    }); 
+0

感謝ニールを。この固定されたfancyboxは2つのクリックを必要とし、私はまだ解決しようとしていなかった別の問題です。 – imHavoc

関連する問題