nathansearles / slidesjs

SlidesJS is obsolete and no longer maintained.
https://nathansearles.github.io/slidesjs/
1.72k stars 356 forks source link

User can customize the paging and currentSlide & nextSlide are sended to callbacks #558

Open hexaJer opened 10 years ago

hexaJer commented 10 years ago
  <div class="container">
    <div id="slides">
      <img src="img/example-slide-1.jpg" alt="Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/"
        data-slidesjs-title="Missy S Link" data-slidesjs-id="missy" data-slidesjs-href="http://www.flickr.com/photos/listenmissy/5087404401/" >
      <img src="img/example-slide-2.jpg" alt="Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/"
        data-slidesjs-title="Daniel Parks" data-slidesjs-id="daniel" data-slidesjs-href="http://www.flickr.com/photos/parksdh/5227623068/" >
      <img src="img/example-slide-3.jpg" alt="Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/"
        data-slidesjs-title="Mike Ranweiler" data-slidesjs-id="mike" data-slidesjs-href="http://www.flickr.com/photos/27874907@N04/4833059991/" >
      <img src="img/example-slide-4.jpg" alt="Photo by: Stuart Seeger Link: http://www.flickr.com/photos/stuseeger/97577796/"
        data-slidesjs-title="Stuart Seeger" data-slidesjs-id="stuart" data-slidesjs-href="http://www.flickr.com/photos/stuseeger/97577796/" >
      <a href="#" class="slidesjs-previous slidesjs-navigation"><i class="icon-chevron-left icon-large"></i></a>
      <a href="#" class="slidesjs-next slidesjs-navigation"><i class="icon-chevron-right icon-large"></i></a>
    </div>
  </div>

result of pagination list :

<ul class="slidesjs-pagination">
  <li id="missy" class="slidesjs-pagination-item">
    <a href="http://www.flickr.com/photos/listenmissy/5087404401/" data-slidesjs-item="0" class="active"><span>Missy S Link</span></a>
  </li>
  <li id="daniel" class="slidesjs-pagination-item">
    <a href="http://www.flickr.com/photos/parksdh/5227623068/" data-slidesjs-item="1" class=""><span>Daniel Parks</span></a>
  </li>
  <li id="mike" class="slidesjs-pagination-item">
    <a href="http://www.flickr.com/photos/27874907@N04/4833059991/" data-slidesjs-item="2" class=""><span>Mike Ranweiler</span></a>
  </li>
  <li id="stuart" class="slidesjs-pagination-item">
    <a href="http://www.flickr.com/photos/stuseeger/97577796/" data-slidesjs-item="3" class=""><span>Stuart Seeger</span></a>
  </li>
</ul>
function onSlideChangeStart(current, next){
    ...
}
$('.slide').slidejs({
    callback : {
        start : onSlideChangeStart
    }
});
hexaJer commented 10 years ago

sorry i don't know how to use minify with coffee script

hexaJer commented 10 years ago

it's ok for minify ! :+1: