Template:Team:Marburg/Template:JSlider

From 2014.igem.org

(Difference between revisions)
(Created page with "<html> <style> #slides { display: none } #slides .slidesjs-navigation { margin-top:3px; } #slides .slidesjs-previous { margin-right: 5px;...")
 
(14 intermediate revisions not shown)
Line 1: Line 1:
-
<html>
+
<html></p>
-
<style>
+
 
 +
  <style>
     #slides {
     #slides {
Line 7: Line 8:
     #slides .slidesjs-navigation {
     #slides .slidesjs-navigation {
-
       margin-top:3px;
+
       margin-top:5px;
     }
     }
-
     #slides .slidesjs-previous {
+
     a.slidesjs-next,
-
       margin-right: 5px;
+
    a.slidesjs-previous,
 +
    a.slidesjs-play,
 +
    a.slidesjs-stop {
 +
       background-image: url("https://static.igem.org/mediawiki/2014/3/3c/Btns-next-prev.png");
 +
      background-repeat: no-repeat;
 +
      display:block;
 +
      width:12px;
 +
      height:18px;
 +
      overflow: hidden;
 +
      text-indent: -9999px;
       float: left;
       float: left;
 +
      margin-right:5px;
     }
     }
-
     #slides .slidesjs-next {
+
     a.slidesjs-next {
-
       margin-right: 5px;
+
       margin-right:10px;
-
       float: left;
+
       background-position: -12px 0;
 +
    }
 +
 
 +
    a:hover.slidesjs-next {
 +
      background-position: -12px -18px;
 +
    }
 +
 
 +
    a.slidesjs-previous {
 +
      background-position: 0 0;
 +
    }
 +
 
 +
    a:hover.slidesjs-previous {
 +
      background-position: 0 -18px;
 +
    }
 +
 
 +
    a.slidesjs-play {
 +
      width:15px;
 +
      background-position: -25px 0;
 +
    }
 +
 
 +
    a:hover.slidesjs-play {
 +
      background-position: -25px -18px;
 +
    }
 +
 
 +
    a.slidesjs-stop {
 +
      width:18px;
 +
      background-position: -41px 0;
 +
    }
 +
 
 +
    a:hover.slidesjs-stop {
 +
      background-position: -41px -18px;
     }
     }
     .slidesjs-pagination {
     .slidesjs-pagination {
-
       margin: 6px 0 0;
+
       margin: 7px 0 0;
       float: right;
       float: right;
       list-style: none;
       list-style: none;
Line 36: Line 77:
       height: 0;
       height: 0;
       padding-top: 13px;
       padding-top: 13px;
-
       background-image: url(img/pagination.png);
+
       background-image: url("https://static.igem.org/mediawiki/2014/a/af/Pagination.png");
       background-position: 0 0;
       background-position: 0 0;
       float: left;
       float: left;
Line 64: Line 105:
       overflow: hidden
       overflow: hidden
     }
     }
 +
  </style>
 +
  <!-- End SlidesJS Optional-->
-
 
+
   <!-- SlidesJS Required: These styles are required if you'd like a responsive slideshow -->
-
   /* SlidesJS Required: These styles are required if you'd like a responsive slideshow */
+
  <style>
-
 
+
     #slides {
     #slides {
       display: none
       display: none
Line 109: Line 151:
   </style>
   </style>
-
 
+
<div class="container">
-
 
+
  <div id="slides">
-
  <div class="container">
+
    <img src="https://static.igem.org/mediawiki/2014/f/ff/Example-slide-1.jpg" alt="Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/">
-
    <div id="slides">
+
    <img src="https://static.igem.org/mediawiki/2014/2/22/Example-slide-2.jpg" alt="Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/">
-
      <img src="img/example-slide-1.jpg" alt="Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/">
+
    <img src="https://static.igem.org/mediawiki/2014/7/7a/Example-slide-3.jpg" alt="Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/">
-
      <img src="img/example-slide-2.jpg" alt="Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/">
+
    <img src="https://static.igem.org/mediawiki/2014/3/3c/Example-slide-4.jpg" alt="Photo by: Stuart SeegerLink: http://www.flickr.com/photos/stuseeger/97577796/">
-
      <img src="img/example-slide-3.jpg" alt="Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/">
+
-
      <img src="img/example-slide-4.jpg" alt="Photo by: Stuart SeegerLink: 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>
   </div>
-
 
+
</div>
   <!-- SlidesJS Required: Link to jquery.slides.js -->
   <!-- SlidesJS Required: Link to jquery.slides.js -->
-
  <script src="js/jquery.slides.min.js"></script>
+
<script type="text/javascript" src="https://2014.igem.org/Template:Team:Marburg/Template:JSlider.js?action=raw"></script>
   <!-- End SlidesJS Required -->
   <!-- End SlidesJS Required -->
Line 131: Line 168:
     $(function() {
     $(function() {
       $('#slides').slidesjs({
       $('#slides').slidesjs({
-
         width: 940,
+
         width: 900,
-
         height: 528,
+
         height: 435,
-
         navigation: false
+
         play: {
 +
          active: true,
 +
          auto: true,
 +
          interval: 4000,
 +
          swap: true
 +
        }
       });
       });
     });
     });
   </script>
   </script>
-
 
+
  <!-- End SlidesJS Required -->
</html>
</html>

Latest revision as of 15:48, 6 October 2014

Photo by: Missy S Link: http://www.flickr.com/photos/listenmissy/5087404401/ Photo by: Daniel Parks Link: http://www.flickr.com/photos/parksdh/5227623068/ Photo by: Mike Ranweiler Link: http://www.flickr.com/photos/27874907@N04/4833059991/ Photo by: Stuart SeegerLink: http://www.flickr.com/photos/stuseeger/97577796/

Retrieved from "http://2014.igem.org/Template:Team:Marburg/Template:JSlider"