jQuery auto 이미지 삽입과 동일한 href 추가

lightbox (prettyphoto)에서 열리는 이미지가있는 div가 있습니다. 하나의 jquery 코드를 사용하여 light 속성에서 모든 div 요소에 rel 속성을 부여하여 이미지를 자동으로 열었습니다. CSS를 사용하여 축소판 너비/높이를 선택했습니다.jQuery auto 이미지 삽입과 동일한 href 추가

이제 자동으로 링크를 추가하려면 비슷한 코드가 필요합니다. 이것이 가능한가?

즉, 미리보기 이미지를 올린 다음 풀 사이즈 이미지를 업로드하고 마지막으로 링크를 추가하지 않고도 백 오피스를 통해 이미지를 업로드하면됩니다.

다음은 HTML입니다 :

<div id="tab2" class="tab_content" style="text-align:center"> 
      <img src="images/img1_thumb.jpg" alt="image1"/> 
     </div>

JQuery와 :

$(document).ready(function(){ 

      $('div.tab_content a').attr('rel', 'prettybox[grandsuite]') 

      $("div.tab_content a").prettyPhoto({animation_speed:'normal',theme:'facebook',slideshow:false, autoplay_slideshow: false, social_tools:false, show_title:false, overlay_gallery:false}); 

     });

감사합니다!

출처

2011-10-19 João Colucas

좋아, 다음을 수행해야합니다 ".JPG"

으로 "_thumb.jpg을"대체

의 "HREF"-Attribute
를 가져 돔
에서 각 요소를 얻을 수 마지막으로 "href"가 원래 이미지 위치로 설정된 주변 요소를 만듭니다.

// Wrap all <img> with an <a> tag and set the link target to the image's src 
$("div.tab_content img").wrap(function(){ 
    return '<a href="' + $(this).attr('src').replace('_thumb.jpg', '.jpg') + '"/>'; 
});

출처

2011-10-19 09:38:55 bflesch

안녕하세요, 귀하의 회신에 감사드립니다. 불행히도 작동하지 않고 prettyphoto는 이미지를로드하지 않고 계속로드하려고 시도합니다. 어쨌든, imgs라는 이름의 img1.jpg는 동시에 (브라우저에서 보았을 때) 썸네일과 라이트 박스에있는 풀 사이즈의 이미지가 될 것입니다. 그래서 _thumb.jpg에 대한 대체품을 추가 할 필요가 없습니다. 어려운 작업을 손에 쥐었습니다! –

(저는 뭔가 생각하고 있었어요 ::: \t \t \t $ ('div.tab_content a') attr ('href', '$ (this) .attr ('src ')'); 아무것도 작동시키지 않아 ..) –

jQuery auto 이미지 삽입과 동일한 href 추가

답변

관련 문제