1
는 I는 다음 갤러리 jQuery를에 설정 한 : - 썸네일 클릭시 rel
속성 값을 취하고에 삽입문제/갤러리
<script type="text/javascript">
$(function() {
$(".image").click(function() {
var image = $(this).attr("rel");
$('#galleryImage').hide();
$('#galleryImage').fadeIn('slow');
$('#galleryImage').html('<img src="' + image + '"/>');
return false;
});
$("#galleryImage").click(function() {
var imageLarge = $(this).attr("rel");
$('#galleryImage').html('<a href="' + imageLarge + '"/>');
$('#galleryImage a').lightBox();
});
});
<div id="galleryImage">
<a href=""><img src="../../Images/Design/Gallery/HavellHouse/havellhouse-small1.jpg" width="337" height="223" alt="forbury court" /></a>
</div>
<a href="#" rel="../../Images/Design/Gallery/HavellHouse/havellhouse-small1.jpg" class="image">
<img src="../../Images/Design/Gallery/HavellHouse/Thumbs/havellhouse-thumb1.jpg" class="thumb" border="0" /></a>
<a href="#" rel="../../Images/Design/Gallery/HavellHouse/havellhouse-small2.jpg" class="image">
<img src="../../Images/Design/Gallery/HavellHouse/Thumbs/havellhouse-thumb2.jpg" class="thumb" border="0" /></a>
<a href="#" rel="../../Images/Design/Gallery/HavellHouse/havellhouse-small3.jpg" class="image">
<img src="../../Images/Design/Gallery/HavellHouse/Thumbs/havellhouse-thumb3.jpg" class="thumb" border="0" /></a>
galleryImage
div는 사용자가 모두 한 곳에서 표시되는 축소판을 통해 다른 이미지를 선택할 수 있도록합니다.
이제 Lightbox를 #galleryImage
div의 현재 이미지에 적용하면 사용자가 클릭하면 더 큰 버전이 라이트 박스 플러그인을 통해 표시되지만, 그것을하는 방법 주위에 머리, 이것이 내가 지금까지 가지고있는 것이다, 나는 바른 방향으로 향하고있다?
$(".image").click(function() {
var image = $(this).attr("rel");
var imageLarge = $(this).attr("title");
$("#galleryImage img").attr("src",image);
$("#galleryImage a").attr("href", imageLarge);
return false;
}
현재 선택된 썸네일에서 가져온 큰 이미지에 URL을 저장하는 제목 값을 사용하여 그냥 jQuery를의 속성 값을 설정하는 대신 HTML의 무리를 삽입 :
도움을 받으십시오. – dtsg