我在编写Fancybox的回调时遇到问题。我在我的quicksand.js文件中使用了Slimbox的回调，该文件工作正常，但最近更改为Fancybox，因为它适合移动设备，而slimbox则不行。好的，所以基本上所讨论的页面工作正常，即所有对Fancybox的调用都有效，直到你执行Quicksand，然后Fancybox已经死了。我知道我需要在我的quicksand.js插件中集成回调，但却无法做到这一点。要添加到复杂功能中，页面上的每个图像都会在页面部分调用不同的Fancybox脚本，就像将鼠标悬停在图像上时一样，它会显示一个带有两个指向两个不同{{1}的链接的掩码}画廊。
以下是头部
中的代码Fancybox现在这里是HTML代码，其中一个图像调用<script type="text/javascript">
$(document).ready(function() {
$(".fancyboxLauncher1").on("click", function () {
$(".fancybox-buttons1").eq(0).trigger("click");
return false;
});
$('.fancybox-buttons1').fancybox({
openEffect : 'elastic',
closeEffect : 'elastic',
prevEffect : 'none',
nextEffect : 'none',
closeBtn : false,
helpers : {
title : {
type : 'inside'
},
buttons : {}
},
});
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$(".fancyboxLauncher2").on("click", function () {
$(".fancybox-buttons2").eq(0).trigger("click");
return false;
});
$('.fancybox-buttons2').fancybox({
openEffect : 'elastic',
closeEffect : 'elastic',
prevEffect : 'none',
nextEffect : 'none',
closeBtn : false,
helpers : {
title : {
type : 'inside'
},
buttons : {}
},
});
});
</script>
fancybox正如我所说，页面工作正常，使您可以拥有两个单独的<div class="portfolio-hover">
<div class="mask"></div>
<ul>
<li class="portfolio-zoom">
<a class="fancyboxLauncher1" href="img/project/gallery/anodising/thumbnail.jpg"
title="Click Here To View The Gallery">zoom</a>
<div style="display: none;">
<a class="fancybox-buttons1" href="img/project/gallery/alert.png" title="Image Gallery
Will Be Available From April 2014">zoom</a>
</div>
</li>
<li class="portfolio-single">
<a class="fancyboxLauncher2" href="img/project/gallery/anodising/thumbnail.jpg"
title="Click Here For Stage Information">single</a>
<div style="display: none;">
<a class="fancybox-buttons2" href="img/project/gallery/alert.png" title="Information
Page Will Be Available From April 2014">single</a>
</div>
</li>
</ul>
</div>
</div>
触发器，具体取决于您将鼠标悬停在图像上时屏幕显示的单击链接（缩放或单个）。我不得不通过调用fancyboxLauncher1和fancyboxLauncher2来区分它以使其工作。
无论如何问题不是这个代码，一旦你运行quicksand.js重新排序图像，然后fancybox不能像上面提到的那样工作，除非你刷新页面，当然这会将图像设置回来进入他们默认的前流沙位置！
正如我所说的，Fancybox所有这一切都正常，所以这里的回调Slimbox代码现在位于调用javascript一次的quicksand.js文件的基础上它已经运行
fancybox这里唯一重要的一行是“runfancybox（）;”一，因为我没有修改任何相邻的行，因为从// call quicksand and assign transition parameters
$holder.quicksand($filteredData, {
duration: 800,
easing: 'swing'
},function() {
// reload other plugins
runfancybox();
});
return false;
改变。这条线可能会引用同一个.js文件的顶部，我已插入以下
Slimbox基本上我不知道是否需要为每个可能的触发器进行回调，即fancboxLauncher1和fancboxLauncher2，或者我是否只需要通过某种简单的函数调用来重新启动$(document).ready(function(){
/* ================ FANCYBOX ================ */
if(jQuery().fancybox) {
$(".fancyboxLauncher1").on("click", function () {
$(".fancybox-buttons1").eq(0).trigger("click");
return false;
});
$('.fancybox-buttons1').fancybox({
openEffect : 'elastic',
closeEffect : 'elastic',
prevEffect : 'none',
nextEffect : 'none',
closeBtn : false,
helpers : {
title : {
type : 'inside'
},
buttons : {}
},
});
$(".fancyboxLauncher2").on("click", function () {
$(".fancybox-buttons2").eq(0).trigger("click");
return false;
});
$('.fancybox-buttons2').fancybox({
openEffect : 'elastic',
closeEffect : 'elastic',
prevEffect : 'none',
nextEffect : 'none',
closeBtn : false,
helpers : {
title : {
type : 'inside'
},
buttons : {}
},
});
}
unmodified js script continues from this point onwards
/* ================ PORTFOLIO QUICKSAND FILTER ================ */
？
我知道这必须与流沙插件末尾的调用相关联。我也知道这就是我的问题所在，即正确地将回调函数插入到流沙插件中。任何帮助都将非常感激。