bxSlider 이미지 슬라이드

홈페이지를 제작하다 보면 

이미지 슬라이드 기능을 자주 사용하곤 하는데 아주 좋은 bxSlider 입니다.

사용하기도 매우 쉽고  MIT 라이센스로 무상으로 제한없이 누구나 사용 가능하며,

반응형 홈페이지에도 적용되니 이보다 좋을수 없을듯합니다.

 

참고로 MIT 라이센스는 

미국 매사추세츠 공과대학교(MIT)에서 해당 대학의 소프트웨어 공학도들을 돕기 위해 개발한 라이센스입니다.
MIT 소프트웨어를 누구라도 무상으로 제한없이 취급해도 좋지만 저작권 표시 및 이 허가 표시를 소프트웨어의 모든 복제물 또는 중요한 부분에 기재해야 합니다. 그리고 저자 또는 저작권자는 소프트웨어에 관해서 아무런 책임을 지지 않는다.

 

뭐 구글에 bxSlider 검색하면 많이 나오긴 합니다.

아무튼 전 이곳에 남겨 봅니다.

 

사용법은

 

See the Pen Untitled by 박상언 (@zsrcvkwa-the-animator) on CodePen.

상단에 css 및 js 선언을 해주고

<ul class="bxslider">
  <li><img src="images/img01.jpg" /></li>
  <li><img src="images/img02.jpg" /></li>
  <li><img src="images/img03.jpg" /></li>
</ul>

처럼 이미지 내용 넣어주고

 

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
$('.bxslider').bxSlider();
});
//]]>
</script>

처럼 스크립트 적용시키면 됩니다.

차~암 쉽죠?

위 CODEPEN 확인하시고 궁금하면 구글링 더 해보시면 도움 될듯요..

 

암튼 가끔씩 이용하는데 찾으려하면 생각이 잘 안나서 ㅎㅎ;;