Template:Team:Marburg/Template:Slider

From 2014.igem.org

(Difference between revisions)

@@ Line 1: / Line 1: @@
-<html>
+<html></p>
      <style>
          .captionOrange, .captionBlack
@@ Line 36: / Line 36: @@
              background: url(../img/browser-icons.png);
          }
+            /*
+            .jssorb01 div           (normal)
+            .jssorb01 div:hover     (normal mouseover)
+            .jssorb01 .av           (active)
+            .jssorb01 .av:hover     (active mouseover)
+            .jssorb01 .dn           (mousedown)
+            */
+            .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av
+            {
+                filter: alpha(opacity=70);
+                opacity: .7;
+                overflow:hidden;
+                cursor: pointer;
+                border: #000 1px solid;
+            }
+            .jssorb01 div { background-color: gray; }
+            .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
+            .jssorb01 .av { background-color: #fff; }
+            .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }
+            /* jssor slider arrow navigator skin 05 css */
+            /*
+            .jssora05l              (normal)
+            .jssora05r              (normal)
+            .jssora05l:hover        (normal mouseover)
+            .jssora05r:hover        (normal mouseover)
+            .jssora05ldn            (mousedown)
+            .jssora05rdn            (mousedown)
+            */
+            .jssora05l, .jssora05r, .jssora05ldn, .jssora05rdn
+            {
+            	position: absolute;
+            	cursor: pointer;
+            	display: block;
+                background: url("https://static.igem.org/mediawiki/2014/d/d3/ULB2014ARROWS.png") no-repeat;
+                overflow:hidden;
+            }
+            .jssora05l { background-position: -10px -40px; }
+            .jssora05r { background-position: -70px -40px; }
+            .jssora05l:hover { background-position: -130px -40px; }
+            .jssora05r:hover { background-position: -190px -40px; }
+            .jssora05ldn { background-position: -250px -40px; }
+            .jssora05rdn { background-position: -310px -40px; }
      </style>
-    <!-- it works the same with all jquery version from 1.x to 2.x -->
-    <script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
-    <!-- use jssor.slider.mini.js (40KB) or jssor.sliderc.mini.js (32KB, with caption, no slideshow) or jssor.sliders.mini.js (28KB, no caption, no slideshow) instead for release -->
-    <!-- jssor.slider.mini.js = jssor.sliderc.mini.js = jssor.sliders.mini.js = (jssor.js + jssor.slider.js) -->
 <script type="text/javascript" src="https://2014.igem.org/Template:Team:Marburg/Template:jssor18.js?action=raw"></script>
 <script type="text/javascript" src="https://2014.igem.org/Template:Team:Marburg/Template:jssor.slider.js?action=raw"></script>
@@ Line 49: / Line 89: @@
              var _SlideshowTransitions = [
-            //Swing Outside in Stairs
-            {$Duration: 1200, x: 0.2, y: -0.1, $Delay: 20, $Cols: 8, $Rows: 4, $Clip: 15, $During: { $Left: [0.3, 0.7], $Top: [0.3, 0.7] }, $Formation: $JssorSlideshowFormations$.$FormationStraightStairs, $Assembly: 260, $Easing: { $Left: $JssorEasing$.$EaseInWave, $Top: $JssorEasing$.$EaseInWave, $Clip: $JssorEasing$.$EaseOutQuad }, $Outside: true, $Round: { $Left: 1.3, $Top: 2.5} }
-            //Dodge Dance Outside out Stairs
-            , { $Duration: 1500, x: 0.3, y: -0.3, $Delay: 20, $Cols: 8, $Rows: 4, $Clip: 15, $During: { $Left: [0.1, 0.9], $Top: [0.1, 0.9] }, $SlideOut: true, $Formation: $JssorSlideshowFormations$.$FormationStraightStairs, $Assembly: 260, $Easing: { $Left: $JssorEasing$.$EaseInJump, $Top: $JssorEasing$.$EaseInJump, $Clip: $JssorEasing$.$EaseOutQuad }, $Outside: true, $Round: { $Left: 0.8, $Top: 2.5} }
-            //Dodge Pet Outside in Stairs
-            , { $Duration: 1500, x: 0.2, y: -0.1, $Delay: 20, $Cols: 8, $Rows: 4, $Clip: 15, $During: { $Left: [0.3, 0.7], $Top: [0.3, 0.7] }, $Formation: $JssorSlideshowFormations$.$FormationStraightStairs, $Assembly: 260, $Easing: { $Left: $JssorEasing$.$EaseInWave, $Top: $JssorEasing$.$EaseInWave, $Clip: $JssorEasing$.$EaseOutQuad }, $Outside: true, $Round: { $Left: 0.8, $Top: 2.5} }
-            //Dodge Dance Outside in Random
-            , { $Duration: 1500, x: 0.3, y: -0.3, $Delay: 80, $Cols: 8, $Rows: 4, $Clip: 15, $During: { $Left: [0.3, 0.7], $Top: [0.3, 0.7] }, $Easing: { $Left: $JssorEasing$.$EaseInJump, $Top: $JssorEasing$.$EaseInJump, $Clip: $JssorEasing$.$EaseOutQuad }, $Outside: true, $Round: { $Left: 0.8, $Top: 2.5} }
-            //Flutter out Wind
-            , { $Duration: 1800, x: 1, y: 0.2, $Delay: 30, $Cols: 10, $Rows: 5, $Clip: 15, $During: { $Left: [0.3, 0.7], $Top: [0.3, 0.7] }, $SlideOut: true, $Reverse: true, $Formation: $JssorSlideshowFormations$.$FormationStraightStairs, $Assembly: 2050, $Easing: { $Left: $JssorEasing$.$EaseInOutSine, $Top: $JssorEasing$.$EaseOutWave, $Clip: $JssorEasing$.$EaseInOutQuad }, $Outside: true, $Round: { $Top: 1.3} }
-            //Collapse Stairs
-            , { $Duration: 1200, $Delay: 30, $Cols: 8, $Rows: 4, $Clip: 15, $SlideOut: true, $Formation: $JssorSlideshowFormations$.$FormationStraightStairs, $Assembly: 2049, $Easing: $JssorEasing$.$EaseOutQuad }
              //Collapse Random
-             , { $Duration: 1000, $Delay: 80, $Cols: 8, $Rows: 4, $Clip: 15, $SlideOut: true, $Easing: $JssorEasing$.$EaseOutQuad }
+             { $Duration: 1000, $Delay: 80, $Cols: 8, $Rows: 4, $Clip: 15, $SlideOut: true, $Easing: $JssorEasing$.$EaseOutQuad }
-            //Vertical Chess Stripe
-            , { $Duration: 1000, y: -1, $Cols: 12, $Formation: $JssorSlideshowFormations$.$FormationStraight, $ChessMode: { $Column: 12} }
-            //Extrude out Stripe
-            , { $Duration: 1000, x: -0.2, $Delay: 40, $Cols: 12, $SlideOut: true, $Formation: $JssorSlideshowFormations$.$FormationStraight, $Assembly: 260, $Easing: { $Left: $JssorEasing$.$EaseInOutExpo, $Opacity: $JssorEasing$.$EaseInOutQuad }, $Opacity: 2, $Outside: true, $Round: { $Top: 0.5} }
-            //Dominoes Stripe
-            , { $Duration: 2000, y: -1, $Delay: 60, $Cols: 15, $SlideOut: true, $Formation: $JssorSlideshowFormations$.$FormationStraight, $Easing: $JssorEasing$.$EaseOutJump, $Round: { $Top: 1.5} }
              ];
@@ Line 157: / Line 171: @@
                  background-color: #000; top: 0px; left: 0px;width: 100%;height:100%;">
              </div>
-             <div style="position: absolute; display: block; background: url(../img/loading.gif) no-repeat center center;
+             <div style="position: absolute; display: block; background: url('https://static.igem.org/mediawiki/2014/b/b9/Mr_slider_loading.gif') no-repeat center center;
                  top: 0px; left: 0px;width: 100%;height:100%;">
              </div>
@@ Line 166: / Line 180: @@
              overflow: hidden;">
              <div>
-                 <a u=image href="#"><img src="https://static.igem.org/mediawiki/2014/d/d1/Mr_s1.jpg" /></a>
+                 <a u=image href="https://2014.igem.org/Team:Marburg:Team"><img src="https://static.igem.org/mediawiki/2014/9/93/MR_slider_team.jpg" /></a>
              </div>
              <div>
-                 <a u=image href="#"><img src="https://static.igem.org/mediawiki/2014/6/60/Mr_s2.jpg" /></a>
+                 <a u=image href="https://2014.igem.org/Team:Marburg:Policy_Practices:Hessentag"><img src="https://static.igem.org/mediawiki/2014/9/9f/MR_slider_hessen.jpg" /></a>
              </div>
              <div>
-                 <a u=image href="#"><img src="https://static.igem.org/mediawiki/2014/5/5f/Mr_s3.jpg" /></a>
+                 <a u=image href="https://2014.igem.org/Team:Marburg:Policy_Practices"><img src="https://static.igem.org/mediawiki/2014/6/6f/MR_slider_blista.jpg" /></a>
              </div>
              <div>
-                 <a u=image href="#"><img src="https://static.igem.org/mediawiki/2014/5/50/Mr_s4.jpg" /></a>
+                 <a u=image href="https://static.igem.org/mediawiki/2014/f/fa/IGEM_Marburg_2014_-_The_SURFkiller.mp4" target="_blank"><img src="https://static.igem.org/mediawiki/2014/8/8e/MR_slider_surfkiller.jpg" /></a>
              </div>
          </div>
@@ Line 181: / Line 195: @@
          <!-- Bullet Navigator Skin Begin -->
          <!-- jssor slider bullet navigator skin 01 -->
-        <style>
-            /*
-            .jssorb01 div           (normal)
-            .jssorb01 div:hover     (normal mouseover)
-            .jssorb01 .av           (active)
-            .jssorb01 .av:hover     (active mouseover)
-            .jssorb01 .dn           (mousedown)
-            */
-            .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av
-            {
-                filter: alpha(opacity=70);
-                opacity: .7;
-                overflow:hidden;
-                cursor: pointer;
-                border: #000 1px solid;
-            }
-            .jssorb01 div { background-color: gray; }
-            .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
-            .jssorb01 .av { background-color: #fff; }
-            .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }
-        </style>
          <!-- bullet navigator container -->
          <div u="navigator" class="jssorb01" style="position: absolute; bottom: 16px; right: 10px;">
@@ Line 207: / Line 200: @@
              <div u="prototype" style="POSITION: absolute; WIDTH: 12px; HEIGHT: 12px;"></div>
          </div>
-        <!-- Bullet Navigator Skin End -->
-        <!-- Arrow Navigator Skin Begin -->
-        <style>
-            /* jssor slider arrow navigator skin 05 css */
-            /*
-            .jssora05l              (normal)
-            .jssora05r              (normal)
-            .jssora05l:hover        (normal mouseover)
-            .jssora05r:hover        (normal mouseover)
-            .jssora05ldn            (mousedown)
-            .jssora05rdn            (mousedown)
-            */
-            .jssora05l, .jssora05r, .jssora05ldn, .jssora05rdn
-            {
-            	position: absolute;
-            	cursor: pointer;
-            	display: block;
-                background: url(../img/a17.png) no-repeat;
-                overflow:hidden;
-            }
-            .jssora05l { background-position: -10px -40px; }
-            .jssora05r { background-position: -70px -40px; }
-            .jssora05l:hover { background-position: -130px -40px; }
-            .jssora05r:hover { background-position: -190px -40px; }
-            .jssora05ldn { background-position: -250px -40px; }
-            .jssora05rdn { background-position: -310px -40px; }
-        </style>
          <!-- Arrow Left -->
          <span u="arrowleft" class="jssora05l" style="width: 40px; height: 40px; top: 123px; left: 8px;">
@@ Line 245: / Line 210: @@
      </div>
      <!-- Jssor Slider End -->
-<style>
-#slider2_container {
-position: relative;
-width: 600px;
-height: 300px;
-margin: 0px auto;
-border: 10px solid #FFF;
-box-shadow: 2px 7px 5px #888;
-}
-</style>
 </html>

Template:Team:Marburg/Template:Slider

From 2014.igem.org

Latest revision as of 02:10, 18 October 2014