리스트에서 이미지 링크 문의
본문
갤러리 게시판에 리스트에서 이미지를 클릭하면 모달창으로 뜨고 있습니다.
혹시, 리스트에 보이는건 1번째 이미지가 보이고 클릭을해서 모달창이 열리면 2번째 이미지가 보이려면 링크를 어떻게 수정해야 하나요?
------------------------------------------------------------------------------
<ul id="gall_ul" class="gall_row">
<?php for ($i=0; $i<count($list); $i++) {
$classes = array();
$classes[] = 'gall_li';
$classes[] = 'col-gn-'.$bo_gallery_cols;
if( $i && ($i % $bo_gallery_cols == 0) ){
$classes[] = 'box_clear';
}
if( $wr_id && $wr_id == $list[$i]['wr_id'] ){
$classes[] = 'gall_now';
}
?>
<li class="<?php echo implode(' ', $classes); ?>">
<div class="gall_box">
<div class="gall_chk chk_box">
<?php if ($is_checkbox) { ?>
<input type="checkbox" name="chk_wr_id[]" value="<?php echo $list[$i]['wr_id'] ?>" id="chk_wr_id_<?php echo $i ?>" class="selec_chk">
<label for="chk_wr_id_<?php echo $i ?>">
<span></span>
<b class="sound_only"><?php echo $list[$i]['subject'] ?></b>
</label>
<?php } ?>
<span class="sound_only">
<?php
if ($wr_id == $list[$i]['wr_id'])
echo "<span class=\"bo_current\">열람중</span>";
else
echo $list[$i]['num'];
?>
</span>
</div>
<div class="gall_con">
<div class="gall_img">
<?php
if (!$list[$i]['is_notice']) {
$thumb = get_list_thumbnail($board['bo_table'], $list[$i]['wr_id'], $board['bo_gallery_width'], $board['bo_gallery_height'], false, true);
}
if(isset($thumb) && $thumb['src']) {
?>
<a href="<?php echo $thumb['ori'] ?>" data-lightbox="bbs-lightbox" data-title="<?php echo $list[$i]['subject'] ?>">
<?php } else { ?>
<a href="<?php echo $list[$i]['href'] ?>">
<?php } ?>
<?php
if ($list[$i]['is_notice']) { // 공지사항 ?>
<span class="is_notice">공지</span>
<?php } else {
if($thumb['src']) {
$img_content = '<img src="'.$thumb['src'].'" alt="'.$thumb['alt'].'" >';
} else {
$img_content = '<span class="no_image">no image</span>';
}
echo $img_content;
}
?>
</a>
</div>
</div>
</div>
</li>
<?php } ?>
<?php if (count($list) == 0) { echo "<li class=\"empty_list\"></li>"; } ?>
</ul>
답변 2
if(isset($thumb) && $thumb['src']) { <===이 행 다음행에다 다음처럼 추가하세요
if($list[$i]['file'][1]['view']) $thumb['ori'] = $list[$i]['file'][1]['path'].'/'.$list[$i]['file'][1]['file'];
두번째 화일이 있으면 두번째 것, 없으면 첫번째 것을 보여줍니다
다음과 같이 해볼 수 있을 것 같습니다.
스크립트 추가
jQuery(function($) {
// 이미지 목록을 배열에 저장
var images = <?php echo json_encode($list); ?>;
var currentImageIndex = 0;
// 모달 창 열기
$('.gall_img a').on('click', function(event) {
event.preventDefault();
var modalImage = $('#modalImage');
// 현재 이미지의 순서를 가져와서 다음 이미지로 업데이트
currentImageIndex = (currentImageIndex + 1) % images.length;
// 모달 창에 다음 이미지 표시
modalImage.attr('src', images[currentImageIndex].href);
});
});
모달창 추가
<!-- 모달 창 추가 -->
<div id="myModal" class="modal">
<span class="close">×</span>
<img id="modalImage" class="modal-content">
</div>
참고하셔서 수정 및 추가 하시면 되지 않을까 합니다.
!-->!-->