JQuery Fancybox 不工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18949693/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery Fancybox not working
提问by Keven
I've followed the directions, but Fancybox isn't working right. I think I need some extra eyes to tell me what I am doing wrong.
我已按照说明进行操作，但 Fancybox 无法正常工作。我想我需要一些额外的眼睛来告诉我我做错了什么。
Any Ideas?
有任何想法吗？
HTML
HTML
The code:
编码：
<h1><a id="v" class= "letter fancybox" data-fancybox-group="group" href="http://placekitten.com/500/500">V</a></h1>
The References:
参考资料：
CSS (top of page):
CSS（页面顶部）：
<link rel="stylesheet" href="home/css/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
JS (bottom of page, including other js):
JS（页面底部，包括其他js）：
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<!-- FancyBox -->
<script type="text/javascript" src="home/js/jquery.fancybox.pack.js?v=2.1.5"></script>
JS
JS
main.js (inside of document ready):
main.js（在文档内准备好）：
$(".fancybox").fancybox({
openEffect : 'fade',
closeEffect : 'fade'
});
I think I should also mention that I didn't put the entire project into one folder. I put the .css and .js files in separate CSS and JS directories and only included the two referenced files. I'm wondering if that has anything to do with it and if I should just copy over the source folder and keep everything in there.
我想我还应该提到我没有将整个项目放在一个文件夹中。我将 .css 和 .js 文件放在单独的 CSS 和 JS 目录中，并且只包含两个引用的文件。我想知道这是否与它有关，我是否应该复制源文件夹并将所有内容保留在那里。
回答by kampro
You should add typefield in your Fancybox' config. Fancybox tries to detect type of content, but when you hrefto e.g. php script which generates image, Fancybox sometimes can't recognize type of content.
您应该type在 Fancybox 的配置中添加字段。Fancybox 尝试检测内容类型，但是当您href使用例如生成图像的 php 脚本时，Fancybox 有时无法识别内容类型。
Change:
改变：
$(".fancybox").fancybox({
openEffect : 'fade',
closeEffect : 'fade'
});
to:
到：
$(".fancybox").fancybox({
openEffect : "fade",
closeEffect : "fade",
type : "image"
});
回答by Keven
I found my own mistake:
我发现了我自己的错误：
My problem was I was referencing a website in my code (even though it creates an image):
我的问题是我在我的代码中引用了一个网站（即使它创建了一个图像）：
<h1><a id="v" class= "letter fancybox" data-fancybox-group="group" href="http://placekitten.com/500/500">V</a></h1>
It should be something like
它应该是这样的
href="image.png"
