롤링 관련 문의합니다..
본문
메인에 이미지 여러개가 롤링되게 하고 싶은데
이미지 한개만(이미지파일이름 : main_bn) 파일 하나만 롤링되네요 ㅠ
어떻게 해야할까요?
<!-- 콘텐츠 시작 { -->
<div id="idx_wrapper">
<!--메인배너-->
<div id="main_bn">
<ul class="bn_ul">
<li class="bn_bg1">
<div class="bn_wr">
<div class="bn_txt">
<h2>[제목]<br>[제목]</h2>
<p>[소주제]<br>[소주제]</p>
</div>
</div>
</li>
<li class="bn_bg1">
<div class="bn_wr">
<div class="bn_txt">
<h2>[제목]<br>[제목]</h2>
p>[소주제]<br>[소주제]</p>
</div>
</div>
</li>
<li class="bn_bg1">
<div class="bn_wr">,
<div class="bn_txt">
<<h2>[제목]<br>[제목]</h2>
<p>[소주제]<br>[소주제]</p>
</div>
</div>
</li>
<li class="bn_bg1">
<div class="bn_wr">
<div class="bn_txt">
<h2>[제목]<br>[제목]</h2>
<p>[소주제]<br>[소주제]</p>
</div>
</div>
</li>
</ul>
<div class="bn_btn">
<a href="#" class="unslider-arrow prev">Previous slide</a>
<a href="#" class="unslider-arrow next">Next slide</a>
</div>
</div>
<!--메인배너-->
<script>
$(function() {
var unslider = $("#main_bn").unslider({
speed: 700, // The speed to animate each slide (in milliseconds)
delay: 5000, // The delay between slide animations (in milliseconds)
keys: true, // Enable keyboard (left, right) arrow shortcuts
dots: true, // Display dot navigation
fluid: false // Support responsive design. May break non-responsive designs
});
$('.unslider-arrow').click(function() {
var fn = this.className.split(' ')[1];
// Either do unslider.data('unslider').next() or .prev() depending on the className
unslider.data('unslider')[fn]();
});
});
</script>
<div id="idx_container">
<?php if ((!$bo_table || $w == 's' ) && !defined("_INDEX_")) { ?><div id="container_title"><?php echo $g5['title'] ?></div><?php } ?>
답변 2
이미지가 li 안에 포함되어야 롤링되면서 보여 질것 같네요.
첫번째 이미지 사진 이름이 main_bn 이고, 두번째 사진은main_bn2 면 어떻게 어디에 적어야할까요?ㅠ