اسلاید شو بند انگشتی

با استفاده از این پلاگین می توانید اسلایدری با عکس های کوچک در سایت خود داشته باشید.

آموزش استفاده

۱- فراخوانی کتابخانه پلاگین و خصوصیت ها

    <link rel="stylesheet" href="screen.css" type="text/css" media="all" title="Screen" />
    <link rel="stylesheet" href="dist/jquery.rondell.css" type="text/css" media="all" title="Screen" />
    <script src="libs/modernizr-2.0.6.min.js"></script>

2-  کد html جهت استفاده پلاگین

<div id="introduction" class="page hasShadow"><br>
      <div id="rondellScroller" class="hidden"><a href="#" title="Dummy link to the cloud">
          <img src="images/products/cloud.png" alt="cloud product" class="no-scale">
          <h5>Your own cloud</h5>
          <p>Buy your own cloud to do some really complicated stuff very fast!</p></a>
          <a href="#" title="Dummy link to the router">
              <img src="images/products/router.png" alt="router product" class="no-scale">
          <h5>The new router</h5>
          <p>The router which can connect to anything without cables!</p></a>
          <a href="#" title="Dummy link to the client">
              <img src="images/products/client.png" alt="client product" class="no-scale">
          <h5>The green computer</h5><p>Our climate saver for only <strong>999$</strong>!</p></a>
          <a href="#" title="Dummy link to the client">
              <img src="images/products/client3.png" alt="client product" class="no-scale">
          <h5>The blue computer</h5><p>Makes you calm while working. Now only <strong>1999$</strong>!</p></a>
          <a href="#" title="Dummy link to the client">
              <img src="images/products/client2.png" alt="client product" class="no-scale">
          <h5>The pink computer</h5><p>For the girls. Only <strong>599$</strong>!</p></a>
          <a href="#" title="Dummy link to the unknown">
              <img src="images/products/unknown.png" alt="unknown product" class="no-scale">
          <h5>Surprise</h5>
          <p>Order this and you will be surprised!</p></a></div><br><br>
    </div><br>
    <noscript><img src="http://tracking.sebastianhelzle.net/piwik.php?idsite=5" style="border:0" alt=""></noscript>
    <script src="libs/jquery-1.9.1.min.js"></script>
    <script src="libs/jquery.mousewheel-3.0.6.min.js"></script>
    <script src="dist/jquery.rondell.js"></script>
    <script src="demohelpers.js"></script><script type="text/javascript">
(function() {
  $(function() {
    return $("#rondellScroller > *").rondell({
      preset: 'scroller'
    });
  });
}).call(this);
</script>