배너슬라이더기능
본문
<div class="crosscover-list">
<?php
$sql = "select * from ".$g5['banner_table']." where b_type='slide' and b_yn = 'Y' order by b_order desc";
$que = sql_query($sql);
while ($row = sql_fetch_array($que)) {
$list_b_target = $row['b_target'];
$list_b_target_text = "";
if ($list_b_target == "OUT") {
$list_b_target_text = "target='_blank'";
}
$list_b_link = $row['b_link']; ?>
<div class="crosscover-item">
<?php if ($list_b_link) { ?>
<a href="<?=$list_b_link?>" <?=$list_b_target_text?>><img src="/data/banner/<?=$row['b_img_tmp']?>" alt="" title="" /></a>
<?php } else { ?>
<img src="/data/banner/<?=$row['b_img_tmp']?>" alt="" title="" />
<?php } ?>
</div>
<?php
}
?>
</div>
슬라이더 배너 코딩인데요.
php로 DB에서 이미지를 불러와서 양쪽 화살표를 눌러주면 넘어가는 형식으로 만들어져있습니다.
이걸 모바일에서 터치로 배너를 밀면 넘어가게 바꾸고 싶은데 구글링해서 보니 jquery를 사용해서 하더라구요. 그래서 그걸 따라해봤더니 저 코드에서는 같은이미지만 나오네요??
제가 작성한 코드는
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/jquery.bxslider.js"></script>
<script type="text/javascript" src="js/jquery7839.js?v=1.2"></script>
넣고
<div class="crosscover-item"> 이 부분class를 id="mainSlide" 로 바꿔줬어요.
예시에서는
위에 jquery 불러오고 이렇게 하니까 모바일에서 터치슬라이드가 되는데 위 코딩에 적용하니
모바일에서 슬라이드는 작동을 하는데 이미지가 동일한 이미지만 나옵니다...
왜 그런지 모르겠어요... 고수님들 알려주세요~
<ul id="mainSlide">
<li>
<a href="detail/event_spot5d9d.html?boardid=event&mode=view&idx=37&sk=&sw=&offset=&category=%E2%80%8B%E2%80%8B">
<img src="images/main/visual32.jpg" alt="iPhone 11 혜택 이벤트">
</a>
</li>
<li>
<a href="detail/event_spotdab9.html?boardid=event&mode=view&idx=49&sk=&sw=&offset=&category=">
<img src="images/main/visual35.jpg" alt="시작">
</a>
</li>
<li>
<a href="detail/event_spot675b.html?boardid=event&mode=view&idx=55&sk=&sw=&offset=&category=">
<img src="images/main/visual34.gif" alt="이벤트">
</a>
</li>
</ul>
답변 1
추가하셨다는 소스의 경로를 확인해보셨나요?
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/jquery.bxslider.js"></script>
<script type="text/javascript" src="js/jquery7839.js?v=1.2"></script>
위 소스 경로로 jquery 파일을 호출을 못하시는 것 같습니다.
<script type="text/javascript" src="<?php echo G5_JS_URL; ?>/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="<?php echo G5_JS_URL; ?>/jquery.bxslider.js"></script>
<script type="text/javascript" src="<?php echo G5_JS_URL; ?>/jquery7839.js?v=1.2"></script>
이처럼 변경해보시고
브라우즈의 소스보기를 눌러 소스에 표기되 위 경로가 다운로드되는지 확인해보세요.
만약 안된다면 jquery 가 있는 경로나 파일을 업로드하셔야할 겁니다.
성공하시길 바랍니다.
위 경로로 했을때 network상 불러오는건 정상적으로 되고 있습니다.
그리고 제가 잘 몰라서 그러는데 스크립트를 못불러오면 터치슬라이드 기능도 안되야 하는거 아닌가요??? 이미지만 같은게 나올뿐 터치슬라이드 기능은 되고 있어서요
jQuery를 못불러오면 정상동작이 될수 없습니다.
하지만 jQuery를 불러와도 코드에 적용/설정부분이 명시되지 않아도 동작되지 않습니다.
따라서 동작에 관한 정확한 이해와 설정이 필요합니다.
그리고 jQuery는 너무 많은 기능들이 들어 있기 때문에
모두 이해한다는 것은 어렵고 많이 사용하고 필요한 기능을 찾아서 적용해야합니다.
다시 말해 잘 사용하기 위해서는 학습이 필요합니다. T.T
아무쪼록 잘 적용하셨어 멋진 사이트 운영하세요~!!!
