답변 2개
채택된 답변
+20 포인트
11개월 전
- skin/shop/basic/item.info.skin.php
</p>
<p><div id="sit_pvi_thumb">
<ul style="display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 10px;">
<?php for ($i=0; $i<count($thumb); $i++) { ?>
<li style="list-style: none;">
<img src="<?php echo $thumb[$i]['src']; ?>" alt="<?php echo $thumb[$i]['alt']; ?>" style="border:1px solid #dbdbdb; cursor: pointer;" onclick="document.querySelector('#sit_pvi_big img').src='<?php echo $thumb[$i]['src']; ?>';">
</li>
<?php } ?>
</ul>
</div></p>
<p>
- skin/shop/basic/style.css
</p>
<p>#sit_pvi_thumb {
display: flex;
gap: 10px;
overflow-x: auto;
padding: 10px 0;
}</p>
<p>#sit_pvi_thumb li {
flex-shrink: 0;
list-style: none;
}</p>
<p>#sit_pvi_thumb img {
border: 1px solid #dbdbdb;
cursor: pointer;
transition: transform 0.2s ease;
}</p>
<p>#sit_pvi_thumb img:hover {
transform: scale(1.1);
border-color: #010101;
}</p>
<p>
로그인 후 평가할 수 있습니다
답변에 대한 댓글 2개
�
스노우맨3
11개월 전
g
glitter0gim
11개월 전
이렇게는 않되나 보군요~
한 수 배워갑니다.
한 수 배워갑니다.
댓글을 작성하려면 로그인이 필요합니다.
11개월 전
item.form.skin.php 입니다
이 정도 디자인을 못비꾼다면 수정하기가 어렵겠습니다
id="sit_pvi_big"
id="sit_pvi_thumb"
위 두가지 스타일 float로 되어있는 것 삭제 (shop/basic/style.css)
#sit_pvi_thumb li{ dispay:inline-block;} 추가
우선 위 처럼 먼저 해보세요
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
스노우맨3
11개월 전
실력?(취미로 하는지라 실력이라고 말하기도 창피하지만......)이 미천하여 죄송합니다.........가끔 코드는 쳐다도 보기싫을때가 있어서.................그러 습니다..........ㅠ.ㅠ
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
skin/shop/basic/item.info.skin.php이 이미지를 가로로 나열하는것과 관계가있나요?