현재 소스에서 롤링배너 자동으로 슬라이드 되도록 하려면 어떻게 해야할까요?

현재 소스에서 롤링배너 자동으로 슬라이드 되도록 하려면 어떻게 해야할까요?

QA

현재 소스에서 롤링배너 자동으로 슬라이드 되도록 하려면 어떻게 해야할까요?

본문

초보중의 초보입니다.

이제 막 구글에서 보고 베끼고 한다고 제대로 할줄도 모르고ㅠㅠㅠㅠ 근데 이쁘게는 만들고 싶고ㅠㅠㅠㅠㅠㅠㅠㅠ

 

원래 버튼 없이 자동으로 되는거였는데 버튼 만드니까 이젠 자동슬라이드가 안됩니다 

어디를 손대야할지도 모르겟어여 ㅠㅠ 코드 복사한거라서..

혹시 도와주실 수 있으신가요

 

 

코딩...너무 어려운것..

 

 

 

 

 

 

<!-- 롤링배너 html-->
<div class="slideshow-container">

<div class="mySlides fade">
  <!-- <div class="numbertext">1 / 7</div> -->
  <a href=""><img src="" style="width:100%; height:600px" /></a>

</div> <!-- mySlides fade -->

<div class="mySlides fade">
  <!-- <div class="numbertext">2 / 7</div>  -->
  <a href=""><img src="" style="width:100%; height:600px" /></a>

</div> <!-- mySlides fade -->

<div class="mySlides fade">
  <!-- <div class="numbertext">3 / 7</div>  -->
  <a href=""><img src="" style="width:100%; height:600px" /></a>

</div> <!-- mySlides fade -->


<div class="mySlides fade">
  <!-- <div class="numbertext">4 / 7</div>  -->
  <a href=""><img src="" style="width:100%; height:600px" /></a>

</div> <!-- mySlides fade -->


<div class="mySlides fade">
  <!-- <div class="numbertext">5 / 7</div>  -->
  <a href=""><img src="" style="width:100%; height:600px" /></a>

</div> <!-- mySlides fade -->


<div class="mySlides fade">
 <!--  <div class="numbertext">6 / 7</div>  -->
  <a href=""><img src="" style="width:100%; height:600px" /></a>

</div> <!-- mySlides fade -->


<div class="mySlides fade">
  <!-- <div class="numbertext">7 / 7</div>  -->
  <a href=""><img src="" style="width:100%; height:600px" /></a>

</div> <!-- mySlides fade -->


<a class="prev" onclick="plusSlides(-1)">❮</a>
<a class="next" onclick="plusSlides(1)">❯</a>


<br>

<div class="btn">
  <span class="dot" onclick="currentSlide(1)"></span> 
  <span class="dot" onclick="currentSlide(2)"></span> 
  <span class="dot" onclick="currentSlide(3)"></span>
  <span class="dot" onclick="currentSlide(4)"></span> 
  <span class="dot" onclick="currentSlide(5)"></span>    
  <span class="dot" onclick="currentSlide(6)"></span> 
  <span class="dot" onclick="currentSlide(7)"></span> 
</div> <!-- btn -->
</div> <!-- slideshow-container -->
                 
<!-- 롤링배너 끝 -->

 

 

 

 

 

 

 

 

 

/* js 영역*/

 


var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
  showSlides(slideIndex += n);
}

function currentSlide(n) {
  showSlides(slideIndex = n);
}

function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1}    
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";  
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block";  
  dots[slideIndex-1].className += " active";
}

 

 

 

이 질문에 댓글 쓰기 :

답변 1

답변을 작성하시기 전에 로그인 해주세요.
전체 8
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT