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

본문 바로가기

쇼핑몰 검색

위토즈소프트 로그인

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

정보공유 목록

JQUERY | 갤러리 슬라이더

페이지 정보

작성자 위토즈 쪽지보내기 아이디로 검색 전체게시물 작성일18-01-10 11:26 조회848 회 댓글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 315건 1 페이지
정보공유 목록
번호 제목 글쓴이 날짜 조회
315 PHP 단어변환 참고. 새글 위토즈 쪽지보내기 아이디로 검색 전체게시물 14:30 23
314 기타 3자리 은행 코드 위토즈 쪽지보내기 아이디로 검색 전체게시물 08-14 49
313 PHP 생년월일로 나이계산 함수 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 08-02 128
312 JQUERY 유투브 영상 바로실행하고 영상위에 텍스트 올려서 링크 걸기. 위토즈 쪽지보내기 아이디로 검색 전체게시물 08-01 96
311 JQUERY 메뉴 슬라이드 다운 위토즈 쪽지보내기 아이디로 검색 전체게시물 08-01 94
310 영카트팁 상품의 기본 통화단위를 달러로 변환 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 07-30 131
309 그누보드팁 블럭 페이지 샘플 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 07-24 141
308 영카트팁 상품의 옵션이 너무 많이 등록되어있을경우 페이지 로딩이 지연됨. 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 07-20 126
307 그누보드팁 저장하고 나서 소스를 수정하지 않았는데 오류가 발생할경우. 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 07-10 119
306 API IOS (아이폰) 로 결제 후 쇼핑몰로 돌아가지 못하는 현상 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 06-28 203
305 PHP 지난주 날짜 구하기 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 05-02 298
304 씨아이보드팁 admin 페이지를 새로 추가해야할경우 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 04-30 303
303 PHP PHP 코드최적화 인기글관련링크 위토즈 쪽지보내기 아이디로 검색 전체게시물 04-20 320
302 기타 SPF 문법 인기글관련링크 위토즈 쪽지보내기 아이디로 검색 전체게시물 04-19 382
301 그누보드팁 LMS 문자발송 오류 인기글 위토즈 쪽지보내기 아이디로 검색 전체게시물 04-18 418
게시물 검색