无法让fancybox加载图像

帕克·理查德

之前,我已经成功集成了fancybox,所以我知道在尝试对其进行故障排除时通常会遇到的疑惑-我似乎仍然无法正常工作。我什至尝试直接链接fancybox js和css的URL,以及删除除fancybox特定的库之外的所有其他jQuery库/脚本。我很困惑

链接到测试站点:http : //parkerrichard.com/studiogreen/html/elements/fire.html

的HTML:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset=“UTF-8”>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Bootstrap Core CSS -->
    <link href="../css/bootstrap.min.css" rel="stylesheet">

    <!-- Bootstrap Custom CSS -->
    <link href="../css/custom.css" rel="stylesheet">

    <!-- fancybox -->
    <link rel="stylesheet" href="../fancybox/source/jquery.fancybox.css" type="text/css" media="screen" />
    <script type="text/javascript" src="../fancybox/source/jquery.fancybox.pack.js"></script>

    <!-- Typekit Custom Fonts -->
    <script src="//use.typekit.net/bcn3ife.js"></script>
    <script>try{Typekit.load();}catch(e){}</script>

    <link href="../css/flexslider.css" rel="stylesheet">

    <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]><script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script><![endif]-->

    <!-- Javascript Library -->
    <script src="../js/respond.min.js"></script>

</head>

<body>  
    <div>
        <div>
            <!-- elements row -->           
            <div class="col-lg-7 col-md-8 col-sm-7 pull-left">
                <!-- elements images -->  
                <div class="mb-sm row elements">
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                        <a class="fancybox" href="../img/elements/fire/img-01.jpg"><img src="../img/elements/fire/img-01.jpg" class="img-responsive pull-left"></a>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                        <a class="fancybox" href="../img/elements/fire/img-02.jpg"><img src="../img/elements/fire/img-02.jpg" class="img-responsive img-centered"></a>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                        <a class="fancybox" href="../img/elements/fire/img-03.jpg"><img src="../img/elements/fire/img-03.jpg" class="img-responsive pull-right"></a>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                        <a class="fancybox" href="../img/elements/fire/img-04.jpg"><img src="../img/elements/fire/img-04.jpg" class="img-responsive pull-left"></a>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                        <a class="fancybox" href="../img/elements/fire/img-05.jpg"><img src="../img/elements/fire/img-05.jpg" class="img-responsive img-centered"></a>
                    </div>
                    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                        <a class="fancybox" href="../img/elements/fire/img-06.jpg"><img src="../img/elements/fire/img-06.jpg" class="img-responsive pull-right"></a>
                    </div>
                </div>
            </div><!--/elements row -->
        </div><!--/body row -->
    </div><!--/container -->


    <!-- javascript -->
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="../js/bootstrap.min.js"></script>
    <script src="../js/jquery.flexslider.js"></script>
    <script src="../js/jquery.studio-green.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $(".fancybox").fancybox();
    });
    </script>


</body>
</html>
特洛伊·汤普森(Troy Thompson)

包含jQuery之后,应包含jquery.fancybox.pack.js。

引用“查询”的jquery.studio-green.js中也存在错误。

摆脱那些JS错误,然后重试。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

FancyBox图像无法正确加载

来自分类Dev

jQuery fancybox的第一个图像为“ ..无法加载内容..”,但下一个图像被加载

来自分类Dev

fancybox-不加载隐藏的图像

来自分类Dev

Fancybox-无法在Fancybox窗口中打开图像

来自分类Dev

Prestashop Fancybox JS无法正确加载

来自分类Dev

无法从URL加载图像

来自分类Dev

pygame图像无法加载?

来自分类Dev

无法加载反应图像

来自分类Dev

无法加载图像 - Javafx

来自分类Dev

imdecode 无法加载图像

来自分类Dev

Webpack:图像无法加载

来自分类Dev

无法加载角度图像

来自分类Dev

Fancybox单个图像在IE上加载失败

来自分类Dev

无法从函数加载fancybox,但它在函数外部起作用

来自分类Dev

带有AJAX加载内容的fancyBox无法正常工作

来自分类Dev

页面加载时自动打开后无法关闭fancybox

来自分类Dev

无法使用OpenCV加载图像

来自分类Dev

无法在ImageViewAsync中加载图像

来自分类Dev

Jekyll CSS图像无法加载

来自分类Dev

Webpack无法加载png图像

来自分类Dev

无法加载简单的图像。Libgdx

来自分类Dev

毕加索android图像无法加载

来自分类Dev

无法在Pygame中加载图像

来自分类Dev

GIMP无法加载大图像

来自分类Dev

CImage :: Load无法加载图像

来自分类Dev

HTML我无法加载图像?

来自分类Dev

无法从KASlideShow pod加载图像

来自分类Dev

Appium Inspector无法加载图像

来自分类Dev

opencv python无法加载图像