简体   繁体   English

无法让fancybox工作

[英]Can't get fancybox to work

I am new to jquery, so I apologize because I am sure this is super easy. 我是jquery的新手,所以我道歉,因为我确信这非常简单。 Spent half the day trying to figure this out and still got no where. 花了半天时间试图解决这个问题,但仍无处可去。

I have another jquery script running and it is running correctly. 我有另一个jquery脚本正在运行,并且正在正确运行。 I tried adding fancyfox and it just will not work. 我尝试添加fancyfox,但无法正常工作。 I even tried to create it own page just to see if I can get it to work and no such luck. 我什至试图创建它自己的页面,只是为了查看是否可以正常使用而没有运气。 I really have no idea what I am doing wrong. 我真的不知道我在做什么错。 I pasted the pages code below. 我在下面粘贴了页面代码。 Any help is extremely appreciated. 任何帮助都非常感谢。 I am also using dreamweaver and noticed that the .js files for the other jquery are attached. 我也在使用Dreamweaver,并注意到附加了其他jquery的.js文件。 I have no idea how I got them attached, but I do not see the .js files for fancybox. 我不知道如何附加它们,但看不到fancybox的.js文件。

    <!-- The JavaScript -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>      
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

    <script type="text/javascript" src="jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="/fancybox/jquery.easing-1.4.pack.js"></script>
    <script type="text/javascript" src="/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
    <script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
    <link rel="stylesheet" href="/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
    <script type="text/javascript">
        $(function() {
            $('ul.nav a').bind('click',function(event){
                var $anchor = $(this);
                /*
                if you want to use one of the easing effects:
                $('html, body').stop().animate({
                    scrollLeft: $($anchor.attr('href')).offset().left
                }, 1500,'easeInOutExpo');
                 */
                $('html, body').stop().animate({
                    scrollLeft: $($anchor.attr('href')).offset().left
                }, 1000);
                event.preventDefault();
            });
            $(".fancyimg").fancybox();
        });
    </script>
</body>

first of all 首先

one of those lines are unnecessary 这些行之一是不必要的

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>      
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

and i suggests you to remove the secend one because those to lines include the jquery lib but the fist one include the last version and the secend one include the version 1.4 我建议您删除第二个版本,因为那些行包含了jquery lib,但是第一个包含了最后一个版本,第二个包含了1.4版本

now after that try this test to see if the "fancybox" are loaded 现在,在那之后尝试此测试以查看是否已加载“ fancybox”

write this code 编写这段代码

  alert($(".fancyimg").fancybox);

if it alert you undefined or null it a sign that the fancybox box not included. 如果它警告您未定义或为null,则表示未包含fancybox框。 if it alert you lines of code it good. 如果它提醒您代码行,那就很好。 and the problem is not in the include it maybe in the html css or you dont definde the fancybox correctly. 并且问题不在html css中的include中,或者您没有正确定义fancybox。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM