왜 내 fancybox가 작동하지 않습니까?

Question

find는 현재 fancybox로 변경하려고 시도하고있는 링크 코드를 첨부하고 있습니다. 내가 할 수있는 모든 것을 시도했지만이 fancybox가 나를 위해 일하기 시작하지 않을 것이다! 나는 많은 연구를했고 실험을했으며 아무 것도 효과가 없었다.

HTML 링크

<a class="fancybox fancybox.iframe" rel="group" href="skype.html"><img src="skype.png" width="30" height="30" /></a> 

일반적인 투여 CSS와 내가

<script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script> 
<script type="text/javascript" src="lib/jquery.mousewheel-3.0.6.pack.js"></script> 
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script> 
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" /> 
<link rel="stylesheet" type="text/css" href="source/helpers/jquery.fancybox-buttons.css?v=1.0.5" /> 
<script type="text/javascript" src="source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script> 
<link rel="stylesheet" type="text/css" href="source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" /> 
<script type="text/javascript" src="source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script> 
<script type="text/javascript" src="source/helpers/jquery.fancybox-media.js?v=1.0.6"></script> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     /* 
     * Simple image gallery. Uses default settings 
     */ 

     $('.fancybox').fancybox(); 

     /* 
     * Different effects 
     */ 

     // Change title type, overlay closing speed 
     $(".fancybox-effects-a").fancybox({ 
      helpers: { 
       title : { 
        type : 'outside' 
       }, 
       overlay : { 
        speedOut : 0 
       } 
      } 
     }); 

     // Disable opening and closing animations, change title type 
     $(".fancybox-effects-b").fancybox({ 
      openEffect : 'none', 
      closeEffect : 'none', 

      helpers : { 
       title : { 
        type : 'over' 
       } 
      } 
     }); 

     // Set custom style, close if clicked, change title type and overlay color 
     $(".fancybox-effects-c").fancybox({ 
      wrapCSS : 'fancybox-custom', 
      closeClick : true, 

      openEffect : 'none', 

      helpers : { 
       title : { 
        type : 'inside' 
       }, 
       overlay : { 
        css : { 
         'background' : 'rgba(238,238,238,0.85)' 
        } 
       } 
      } 
     }); 

     // Remove padding, set opening and closing animations, close if clicked and disable overlay 
     $(".fancybox-effects-d").fancybox({ 
      padding: 0, 

      openEffect : 'elastic', 
      openSpeed : 150, 

      closeEffect : 'elastic', 
      closeSpeed : 150, 

      closeClick : true, 

      helpers : { 
       overlay : null 
      } 
     }); 

     /* 
     * Button helper. Disable animations, hide close button, change title type and content 
     */ 

     $('.fancybox-buttons').fancybox({ 
      openEffect : 'none', 
      closeEffect : 'none', 

      prevEffect : 'none', 
      nextEffect : 'none', 

      closeBtn : false, 

      helpers : { 
       title : { 
        type : 'inside' 
       }, 
       buttons : {} 
      }, 

      afterLoad : function() { 
       this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : ''); 
      } 
     }); 


     /* 
     * Thumbnail helper. Disable animations, hide close button, arrows and slide to next gallery item if clicked 
     */ 

     $('.fancybox-thumbs').fancybox({ 
      prevEffect : 'none', 
      nextEffect : 'none', 

      closeBtn : false, 
      arrows : false, 
      nextClick : true, 

      helpers : { 
       thumbs : { 
        width : 50, 
        height : 50 
       } 
      } 
     }); 

     /* 
     * Media helper. Group items, disable animations, hide arrows, enable media and button helpers. 
     */ 
     $('.fancybox-media') 
      .attr('rel', 'media-gallery') 
      .fancybox({ 
       openEffect : 'none', 
       closeEffect : 'none', 
       prevEffect : 'none', 
       nextEffect : 'none', 

       arrows : false, 
       helpers : { 
        media : {}, 
        buttons : {} 
       } 
      }); 

     /* 
     * Open manually 
     */ 

     $("#fancybox-manual-a").click(function() { 
      $.fancybox.open('1_b.jpg'); 
     }); 

     $("#fancybox-manual-b").click(function() { 
      $.fancybox.open({ 
       href : 'iframe.html', 
       type : 'iframe', 
       padding : 5 
      }); 
     }); 

     $("#fancybox-manual-c").click(function() { 
      $.fancybox.open([ 
       { 
        href : '1_b.jpg', 
        title : 'My title' 
       }, { 
        href : '2_b.jpg', 
        title : '2nd title' 
       }, { 
        href : '3_b.jpg' 
       } 
      ], { 
       helpers : { 
        thumbs : { 
         width: 75, 
         height: 50 
        } 
       } 
      }); 
     }); 


    }); 
</script> 
<style type="text/css"> 
    .fancybox-custom .fancybox-skin { 
     box-shadow: 0 0 50px #222; 
    } 
</style> 

Answer 1

밝혀 그것은 사이트 별 문제가 그들을 체크 그대로 모두 연결되어 JQuery와 LINK. FancyBox와 bxSlider (내 개인적인 선호) - 그러나 jQuery를 두 번로드하려고합니다.

당신 부하 :

jQuery1.10 
fancyBox.js 
jQuery1.11 
bxSlider.js 

당신은 그래서 당신의 문제로주의를 기울여야한다 2 요청을 제거, jQuery를의 인스턴스가 필요합니다.