프리랜서 웹디자이너 웹퍼블리셔RELATION

RELATION 로고

홈페이지 소스

[소스] 배너(쇼핑몰)_오른쪽에서 왼쪽으로 자동 이동 슬라이드 배너

2017.11.10
북마크 작성자 정보
첨부이미지(0/1)
쇼핑몰에서 많이 쓰이는 자동 슬라이드 배너
swiper.js 를 이용하여 여러개를 생성 할수 있다.


rolling.js
      $(function() {
		
				var myNum = Math.floor(Math.random()*5)+1;  //랜덤
		  //var myNum =  0;

				$('.slideshow').after('<div class="slider_pg">').cycle({
					fx: 'scrollLeft',
					speed: 1000,
					timeout: 4000,
					//timeout makes things pause
					delay: 1000,
					pager: '.slider_pg',
					startingSlide: myNum,
					pause: 1,
					pauseOnPagerHover:1
				});


				$('.slideshow2').after('<div class="slider_pg2">').cycle({
					fx: 'scrollLeft',
					speed: 900,
					timeout: 5000,
					//timeout makes things pause
					delay: 1000,
					pager: '.slider_pg2',
					startingSlide: myNum,
					pause: 1,
					pauseOnPagerHover:1
				});
		
		});


데모보기
http://relation.co.kr/images_board/board_system_publishing/76/index.html
http://relation.co.kr/images_board/board_system_publishing/76/index2.html

이 포스트 공유하기

전체목록