将Flickr与Codrops图库集成的问题

Question

我目前正在使用Codrops全屏画廊创建一个Flickr画廊。我已经成功地从flickr账户导入了flickr图片，并且可以处理非flickr图片，但是当告诉flickr使用Codrops图库时，它似乎停止工作了。

网站网址: Flickr这是http://www.media21a.co.uk/development/fullthrottle/flickr/文档：http://www.media21a.co.uk/development/fullthrottle/wp-content/themes/fullthrottle/js/flickrImport.js这是画廊文档：http://www.media21a.co.uk/development/fullthrottle/wp-content/themes/fullthrottle/js/gallery.js

我知道如何让它与fancybox (lightbox)一起工作，但我不确定如何让它与codrops画廊一起工作。

function attachFancyBox()
{
    $(".fancyBox").fancybox();
} 

    /*  BEGIN OPTIONAL FANCYBOX PARAMS */
    "rel":"casabelmonte",            // Rel tag to enable forward/back buttons on fancybox
    "imageLink":"preview",         // Tells the script to grab the image url for fancybox to show
    "className":"fancyBox",     // Class for attaching fancybox
    "callback":attachFancyBox  // Once the images show attach the fancybox script
    /* END */

如果需要，这里是我的全局脚本：

$(window).load(function() {


    $(".dropgallery a, #fp_thumbtoggle").removeAttr("title");

    $('#fp_thumbtoggle, .dropgallery img').click(function() {
        $('#fp_thumbtoggle').toggleClass("active");

        if ($('#fp_thumbtoggle').hasClass('active')){
            $('#fp_thumbtoggle').animate({top:'65px'});
        }else{
            $('#fp_thumbtoggle').animate({top:'185px'});
        }
        $('.dropgallery').slideToggle('500');

    });

    });

我已经设法让Youtube和Vimeo视频导入，它的效果很好，如果你能帮我解决这个问题，我一定会在网站的代码中添加你的链接，我会在facebook & twitter上添加几个呼喊：)。

Answer 1

您尝试为尚不存在的元素绑定click处理程序(用于thumbs)，因为它们是动态加载的。要使其正常工作，请替换行(在gallery.js中)：

$thumbScroller.find('.content').bind('click', function(e){

至：

$thumbScroller.find('.content').live('click', function(e){

这将使缩略图点击工作。在此之后，在flickrImport.js中，将图片的alt属性中的url从_m更改为_b大小，以便在单击后将加载图片的大版本，而不是再次加载_m大小。示例：

alt="http://farm'+photo.farm+'.static.flickr.com/'+photo.server+'/'+photo.id+'_'+photo.secret+'_m.jpg"

更改为：

alt="http://farm'+photo.farm+'.static.flickr.com/'+photo.server+'/'+photo.id+'_'+photo.secret+'_b.jpg"

编辑:我忘了提一下--缺少两个函数(showNav()和hideThumbs())。它们是从gallery.js内部调用的。