2011-09-01 4 views
1

현재 Codrops 전체 화면 갤러리를 사용하여 Flickr 갤러리를 구성 중입니다. 필자는 flickr 이미지를 flickr 계정에서 가져 왔지만 flickr이 아닌 이미지로 작업하는 전체 화면 이미지를 얻었지만 flickr에게 Codrops 갤러리 작업을 알리면 작동을 멈추는 것처럼 보입니다.Flickr와 Codrops의 통합 전체 화면 갤러리 문제

웹 사이트 URL : http://www.media21a.co.uk/development/fullthrottle/flickr/ 이 플리커 문서입니다 : http://www.media21a.co.uk/development/fullthrottle/wp-content/themes/fullthrottle/js/gallery.js

내가 어떻게 fancybox (라이트)와 함께 작업하지만 난 그것을 얻을하는 방법을 잘 모르겠어요 얻을 알고 : http://www.media21a.co.uk/development/fullthrottle/wp-content/themes/fullthrottle/js/flickrImport.js 이 갤러리 문서가이 코 도프 갤러리로 작업하십시오. 여기에 필요한 내 글로벌 스크립트의 경우

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'); 

    }); 

    }); 

당신이 나를 도울 수 있다면이에, 위대한 작품을 확실거야 웹 사이트의 코딩 내에서 링크를 추가하면 페이스 북에 몇 가지 큰 소리를 추가합니다 & twitter :).

+0

정확히 작동하지 않는 것은 무엇입니까? http://www.media21a.co.uk/development/fullthrottle/flickr/에서 축소판을 클릭하면 더 큰 버전을로드하고 표시해야합니까? – WTK

+0

예 홈페이지와 쇼케이스 페이지처럼 작동하고 싶습니다.이 @WTK를 많이 보셨습니까? – Delete

+0

나는 그것을 조사하고있다 - 나는 한 가지를 고쳤지만로드 된 그림은 여전히 ​​큰 것 대신 작은 크기이다. – WTK

답변

1

동적으로로드되었으므로 아직 존재하지 않는 요소의 클릭 핸들러 (엄지 손가락)를 바인딩하려고합니다. 그것이 작동 (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 내에서 호출됩니다.

+0

감사합니다 :) 이것은 대우를합니다. 내가 말했듯이 나는 당신의 사이트로 당신의 링크를 터뜨릴 것이고, 당신에게 페이 스북에 외침을 줄 것이다. 외치기를 원하는 메시지를 보내면 온라인으로 팝업됩니다.) – Delete