갤러리 슬라이더 > 정보공유

본문 바로가기

쇼핑몰 검색

위토즈소프트 로그인

회원가입 회원가입  아이디/비밀번호찾기 아이디/비밀번호찾기

정보공유 목록

JQUERY | 갤러리 슬라이더

페이지 정보

작성자 위토즈 쪽지보내기 아이디로 검색 전체게시물 작성일18-01-10 11:26 조회337 회 댓글0 건

첨부파일

본문

 

<script language="javascript" type="text/javascript" src="./js/jquery.lightSlider.js"></script> 

 

<style>

    #bx_gallery {position:relative;}

    #bx_gallery .photo_slide {position:absolute;top:25%;width:100%;}

</style>

 

<ul id="imageGallery">

    <li data-thumb="{domain}/m150106_000.jpg"><img src="{domain}/m150106_000.jpg" /></li>

    <li data-thumb="{domain}/m150105_000.jpg"><img src="{domain}/m150105_000.jpg" /></li>

    <li data-thumb="{domain}/m150105_001.jpg"><img src="{domain}/m150105_001.jpg" /></li>

    <li data-thumb="{domain}/m150106_000.jpg"><img src="{domain}/m150106_000.jpg" /></li>

    <li data-thumb="{domain}/m150105_000.jpg"><img src="{domain}/m150105_000.jpg" /></li>

    <li data-thumb="{domain}/m150105_001.jpg"><img src="{domain}/m150105_001.jpg" /></li>

    <li data-thumb="{domain}/m150106_000.jpg"><img src="{domain}/m150106_000.jpg" /></li>

    <li data-thumb="{domain}/m150105_000.jpg"><img src="{domain}/m150105_000.jpg" /></li>

    <li data-thumb="{domain}/m150105_001.jpg"><img src="{domain}/m150105_001.jpg" /></li>

</ul>

 

<script type="text/javascript">

<!--

    $('#imageGallery').lightSlider({

        gallery:true,

        item:1,

        thumbItem:4,

        slideMargin:0,

        mode:'fade',

        currentPagerPosition:'left',

        controls         : true,  // Whether to display prev/next buttons.

        loop             : true, // Allows to go to the other end of the gallery at first/last img.

        auto             : true, // Enables slideshow mode.

        pause            : 3000,  // Delay (in ms) between transitions in slideshow mode.

        escKey           : false,  // Whether lightGallery should be closed when user presses "Esc".

        closable         : false,  //allows clicks on dimmer to close gallery

        onSliderLoad: function(el) {

            el.lightGallery();

        }

    });

//-->

</script>

  • 페이스북으로 보내기
  • 트위터로 보내기
  • 구글플러스로 보내기

댓글목록

등록된 댓글이 없습니다.

정보공유 목록

Total 290건 1 페이지
정보공유 목록
번호 제목 글쓴이 날짜 조회
열람중 JQUERY 갤러리 슬라이더 인기글첨부파일 위토즈 쪽지보내기 아이디로 검색 전체게시물 01-10 338
289 API 구글 검색엔진 커스텀 생성 인기글관련링크 위토즈 쪽지보내기 아이디로 검색 전체게시물 12-15 217
288 API 한국수출입은행 환율 API 신청방법 인기글관련링크 위토즈 쪽지보내기 아이디로 검색 전체게시물 12-13 284
287 API 페이팔 테스트계정 생성방법 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-23 342
286 씨아이보드팁 [씨아이보드] 쿼리문에 between 구문 주기. 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-15 361
285 씨아이보드팁 [씨아이보드] back-end 처리로 결과값을 받아야 하는경우 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-14 230
284 씨아이보드팁 [씨아이보드] 관리자 메뉴 링크 경로를 별도 경로로 적용해야할 경우 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-09 383
283 씨아이보드팁 [씨아이보드] 결제모듈 버그수정 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-08 333
282 씨아이보드팁 [씨아이보드] 모바일에서 ptype 필드 추가. 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-08 335
281 씨아이보드팁 [씨아이보드] KCP결제환경에서 모바일 로 결제할경우 오류가 발생 할경우 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-08 349
280 JQUERY 원하는 영역 프린트 인기글첨부파일 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-08 250
279 씨아이보드팁 view 단에서 helper 사용하기. 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-07 322
278 씨아이보드팁 include 를 view 단에 적용하고 싶을경우. 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 11-07 304
277 씨아이보드팁 db query 찍어보기 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 10-20 645
276 JQUERY jquery.validate 다중옵션 입력 체크 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 10-18 670
게시물 검색