나는 내가 작업하고있는 웹 사이트에 easySlider 1.7을 설치했다. 웬일인지, 내가 무엇을해도 다음 버튼과 이전 버튼이 전혀 나타나지 않습니다. 나는 jQuery 전체에 대해 그다지 새롭지는 않지만 매우 다양한 옵션을 시도한 후에 완전히 난처한 것입니다. CSS, 슬라이더 및 HTML에 대한 jQuery에 대한 코드는 아래에 있습니다. 나는 "banner.js"라고 불리는 별도의 .js 파일에 슬라이더 jQuery가 있으며, CSS는 메인 CSS 파일에 첨부되어있다. 나는 정말로 단지 뭔가를 내려다 볼 수 있었지만 나는 해결책을 찾기 위해 웹에서 위아래로 보았다. 미리 감사드립니다.jQuery easySlider 1.7 - 다음 및 이전 버튼을 추가하려면 어떻게합니까?
CSS :
#slider ul, #slider li{
margin:0;
padding:0;
list-style:none;
}
#slider, #slider li{
height:290px;
width:1024px;
overflow:hidden;
}
#slider{
margin-left:0px;
}
#prevBtn, #nextBtn{
width:30px;
height:77px;
float:left;
left:0px;
top:50px;
}
#nextBtn{
left:1024px;
}
#prevBtn a, #nextBtn a{
display:block;
width:30px;
height:77px;
background:url(../images/btn_prev.gif) no-repeat 0 0;
}
#nextBtn a{
background:url(../images/btn_next.gif) no-repeat 0 0;
}
`
JQuery와 슬라이드 기능 :
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
pause:3000,
continuous: true,
controlsShow:true,
prevId:'prevBtn',
nextId:'nextBtn'
});
})`
HTML 마크 업 :
<div id="wrapper">
<div class="nav">
</div>
<div class="banner">
<div id="slider">
<ul>
<li><img src="images/banner/img001.png" alt="001" /></li>
<li><img src="images/banner/img002.png" alt="002" /></li>
<li><img src="images/banner/img003.png" alt="003" /></li>
</ul>
</div>
</div>
<div class="mxNav">
<p class="mxNavText"> Order Now! </p>
</div>
여기
감사합니다. 확실히 루키 실수 였고 CSS의 이미지 경로가 옳지 않았습니다. 나는 그들 모두에게 일하고 스타일을 부여했다. 나를 도와 주셔서 다시 한번 감사드립니다! –
언제든지 기뻤습니다. – d2burke