Question

我正在尝试fancybox工作，但我可以让它工作。我一直在寻找论坛，但我不能帮助我理解我做错的答案。也许没必要说，但我是jQuery的真正首发。

我有这样的代码：

<link href='http://fonts.googleapis.com/css?family=Roboto:400,700,300' rel='stylesheet' type='text/css'>

<link rel="stylesheet" href="css/reset.css"> <!-- CSS reset -->
<link rel="stylesheet" href="css/style.css"> <!-- Resource style -->
<script src="js/modernizr.js"></script> <!-- Modernizr -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> <!-- jQuery -->
<link rel="stylesheet" href="css/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" /> <!-- fancybox -->
<script type="text/javascript" src="js/jquery.fancybox.pack.js?v=2.1.5"></script> <!-- fancybox -->

<script type="text/javascript">
    $(document).ready(function() {
        $(".fancybox").fancybox();
    });
</script>

当我有一个简短的代码时，它工作正常。我已经在this site托管了该网站。有人能告诉我我做了什么以及如何解决它。

提前完成。

Answer 1

There is a jquery conflict, because of two jquery versions. 
Add all your js file to the bottom and in the following order just before </body>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="js/modernizr.js"></script> <!-- Modernizr -->
    <script type="text/javascript" src="js/jquery.fancybox.pack.js?v=2.1.5"></script> <!-- fancybox -->
    <script src="js/main.js"></script> <!-- Resource jQuery -->
    <script type="text/javascript">
        $(document).ready(function() {
            $(".fancybox").fancybox();
        });
    </script>


Please remove all javascripts from the head section.

so your head section looks like :-

<head>
    <title>Alternate Fixed And Scroll Backgrounds</title>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link href='http://fonts.googleapis.com/css?family=Roboto:400,700,300' rel='stylesheet' type='text/css'>

    <link rel="stylesheet" href="http://psteintj.home.xs4all.nl/css/reset.css"> <!-- CSS reset -->
    <link rel="stylesheet" href="http://psteintj.home.xs4all.nl/css/style.css"> <!-- Resource style -->


    <link rel="stylesheet" href="http://psteintj.home.xs4all.nl/css/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" /> <!-- fancybox -->

</head>

Fancybox不起作用，图像在同一窗口中打开

1 个答案: