article:
UI: Music Black UI Kit (PSD)
article:
JS Plugin & Code: Unslider.js

JS Plugin & Code: SlidesJS

Advertisement

SlidesJS is a responsive slideshow plug-in for jQuery (1.7.1+) with features like touch and CSS3 transitions. 

Features
  • Responsive: Create dynamic slideshows that adapt to any screen;
  • CSS3 transitions: Animations that run smoothly on modern devices;
  • Touch: Swipe support that tracks touch movements on supported devices;
  • Easy setup: Get going fast with the easy-to-use examples;

Plugin: SlidesJS


Implement

<!doctype html>
<html>
<head>
  <style>
    /* Prevents slides from flashing */
    #slides {
      display:none;
    }
  </style>

  <script src="http://code.jquery.com/jquery-latest.min.js"></script>
  <script src="jquery.slides.min.js"></script>

  <script>
    $(function(){
      $("#slides").slidesjs({
        width: 940,
        height: 528
      });
    });
  </script>
</head>
<body>
  <div id="slides">
    <img src="http://placehold.it/940x528">
    <img src="http://placehold.it/940x528">
    <img src="http://placehold.it/940x528">
    <img src="http://placehold.it/940x528">
    <img src="http://placehold.it/940x528">
  </div>
</body>
</html>

Options

  • width (number) & height (number): set width and height of the slideshow;
  • start (number): set the first slide in the slideshow - default value is 1;
  • navigation (object): next and previous button settings;
  • pagination (object): pagination settings;
  • play (object): play and stop button setting;
  • effect (object): effects setting;
  • callback (function): slidesJS callbacks;


Enjoy!


Advertisement
Tags: slider, slide, js, plugin, javascript, jquery, pagination, play, elements

Leave a Comment

No Comment

© Creative3x Ltd.