2014-05-22 5 views
-1

저는 jQuery를 처음 접했고 전에는 fancybox를 사용 해보지 않았습니다. 설치를 시도했지만 작동하지 않습니다. 내가 찾은 몇 가지 테스트 스크립트를 사용했지만 여전히 아무것도 사용하지 않았습니다. 여기 내 코드는 다음과 같습니다 머리에 나는 (모든 파일에 대한 경로가 올바른지) 다음과 같은 한 :Fancybox 2가 로컬 호스트에서 작동하지 않습니다.

<script type='text/javascript'> 
$(document).ready(function() { 

    /* This is basic - uses default settings */ 

    $("a#single_image").fancybox(); 

    /* Using custom settings */ 

    $("a#inline").fancybox({ 
     'hideOnContentClick': true 
    }); 


}); 
</script> 
<a id="single_image" title="" href=""><img src="http://localhost/images/something.png" alt="" /></a> 

을하지만 이미지를 클릭하면, 아무 일도 발생하지 않습니다 :

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

그리고 내 시험 문서에

.

답변

0

jquery 스크립트를 마지막으로 선언하고 있습니다. 그 include는 jquery를 사용하는 다른 스크립트에 의해 선행되어야한다. localhost에 있는지 없는지 상관 없습니다.

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

시도해 보았습니다. 도움이되지 않았습니다. – user3560463

+0

아마도 당신이 받고있는 오류를 게시 할 수 있을까요? Chrome을 사용하는 경우 Ctrl + Shift + J를 누른 다음 Console을 누릅니다. – user3036342

+0

콘솔에 오류가 없습니다.하지만 내 페이지에서 다른 모든 항목을 제거하려고 시도했지만 작동합니다. 그것은 문제가 내 두 번째, 자신의 CSS 파일처럼 보이지만 왜 그런지 모르겠습니다. – user3560463

0

jquery-2.1.1.js와 동일한 문제가 발생했습니다. 일단 fancybox에서 제공 한 jquery-1.10.1.js를 사용 했더니 jquery-1.9.1.js를 사용하여 문서를 렌더링하지 못하게되었습니다.

도움이되는지 이미 알았는지 모르겠지만 발견 한 내용을 추가 할 것입니다.

관련 문제