랜덤 배경화면 및 제이쿼리 질문드립니다.

랜덤 배경화면 및 제이쿼리 질문드립니다.

QA

랜덤 배경화면 및 제이쿼리 질문드립니다.

본문

swiper 슬라이드 사용하구 있습니다. 

제가 원하는 기능은 새로고침 시 나오는 배경화면은 랜덤이되, 이후 넘어가는 슬라이드는

순서대로 넘어가는 기능인데요,

아래 소스는 새로고침 시에도, 넘어가는 순서도 랜덤으로 뜨더라구요.. 

html와 스크립트는 아래와 같고, css background로 /img/1.jpg ~ 6.jpg 되어있습니다 

그리고 array부분에 하나하나 넣지 않고 간단하게 줄이고 싶은데 아직 그만한 스킬이 안되서 그 또한 도움을 요청드립니다.

 

<div class="swiper-container">

<div class="swiper-wrapper">

<div class="swiper-slide bg01"></div>

<div class="swiper-slide bg02"></div>

<div class="swiper-slide bg03"></div>

<div class="swiper-slide bg04"></div>

<div class="swiper-slide bg05"></div>

<div class="swiper-slide bg06"></div>

</div>

</div>

 

 

<script>

$(function () {

var swiper = new Swiper('.swiper-container', {

effect : 'fade', // 페이드 효과 사용

slidesPerView : 'auto',

autoplay : { // 자동 슬라이드 설정 , 비 활성화 시 false

delay : 1000, // 시간 설정

disableOnInteraction : false, // false로 설정하면 스와이프 후 자동 재생이 비활성화 되지 않음

},

});

var SlideNum = $('.swiper-slide').length;

var Array = ['/theme/basic/img/1.jpg','/theme/basic/img/2.jpg','/theme/basic/img/3.jpg','/theme/basic/img/4.jpg','/theme/basic/img/5.jpg','/theme/basic/img/6.jpg'];

for (i = 1; i <= SlideNum; i += 1) {

var RandomNum = Math.floor(Math.random() * 6);

if (Array.indexOf(RandomNum) === -1) {

Array.push(RandomNum);

$('.swiper-slide').eq(RandomNum).addClass('bg0' + i + '');

 

} else {

i -= 1;

}

}

});

</script>

 

 

 

질문 요약 

1. 배경화면이 새로고침 시에는 랜덤이되 다음 나오는 이미지는 순서대로 나오게 하려면 어떻게 수정해야 할까요?

2. array 부분에 경로를 각각 주지 않고 압축해서 적는 방법이 있을까요?  

 

 

이 질문에 댓글 쓰기 :

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

회원로그인

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