Template:Team:Marburg/Template:Slider

From 2014.igem.org

(Difference between revisions)
 
(28 intermediate revisions not shown)
Line 1: Line 1:
<html></p>
<html></p>
-
<style>
+
    <style>  
         .captionOrange, .captionBlack
         .captionOrange, .captionBlack
         {
         {
Line 36: Line 36:
             background: url(../img/browser-icons.png);
             background: url(../img/browser-icons.png);
         }
         }
-
 
             /*
             /*
Line 57: Line 56:
             .jssorb01 .av { background-color: #fff; }
             .jssorb01 .av { background-color: #fff; }
             .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }
             .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }
-
 
             /* jssor slider arrow navigator skin 05 css */
             /* jssor slider arrow navigator skin 05 css */
Line 73: Line 71:
             cursor: pointer;
             cursor: pointer;
             display: block;
             display: block;
-
                 background: url(../img/a17.png) no-repeat;
+
                 background: url("https://static.igem.org/mediawiki/2014/d/d3/ULB2014ARROWS.png") no-repeat;
                 overflow:hidden;
                 overflow:hidden;
             }
             }
Line 82: Line 80:
             .jssora05ldn { background-position: -250px -40px; }
             .jssora05ldn { background-position: -250px -40px; }
             .jssora05rdn { background-position: -310px -40px; }
             .jssora05rdn { background-position: -310px -40px; }
-
</style>
+
    </style>
-
 
+
<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:jssor18.js?action=raw">
+
<script type="text/javascript" src="https://2014.igem.org/Template:Team:Marburg/Template:jssor.slider.js?action=raw"></script>
-
<script type="text/javascript" src="https://2014.igem.org/Template:Team:Marburg/Template:jssor.slider.js?action=raw">
+
-
 
+
     <script>
     <script>
         jQuery(document).ready(function ($) {
         jQuery(document).ready(function ($) {
Line 93: Line 89:
             var _SlideshowTransitions = [
             var _SlideshowTransitions = [
-
                //Rotate Overlap
+
            //Collapse Random
-
                { $Duration: 1200, $Zoom: 11, $Rotate: -1, $Easing: { $Zoom: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Round: { $Rotate: 0.5 }, $Brother: { $Duration: 1200, $Zoom: 1, $Rotate: 1, $Easing: $JssorEasing$.$EaseSwing, $Opacity: 2, $Round: { $Rotate: 0.5 }, $Shift: 90 } },
+
            { $Duration: 1000, $Delay: 80, $Cols: 8, $Rows: 4, $Clip: 15, $SlideOut: true, $Easing: $JssorEasing$.$EaseOutQuad }
-
                //Switch
+
-
                { $Duration: 1400, x: 0.25, $Zoom: 1.5, $Easing: { $Left: $JssorEasing$.$EaseInWave, $Zoom: $JssorEasing$.$EaseInSine }, $Opacity: 2, $ZIndex: -10, $Brother: { $Duration: 1400, x: -0.25, $Zoom: 1.5, $Easing: { $Left: $JssorEasing$.$EaseInWave, $Zoom: $JssorEasing$.$EaseInSine }, $Opacity: 2, $ZIndex: -10 } },
+
-
                //Rotate Relay
+
-
                { $Duration: 1200, $Zoom: 11, $Rotate: 1, $Easing: { $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Round: { $Rotate: 1 }, $ZIndex: -10, $Brother: { $Duration: 1200, $Zoom: 11, $Rotate: -1, $Easing: { $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Round: { $Rotate: 1 }, $ZIndex: -10, $Shift: 600 } },
+
-
                //Doors
+
-
                { $Duration: 1500, x: 0.5, $Cols: 2, $ChessMode: { $Column: 3 }, $Easing: { $Left: $JssorEasing$.$EaseInOutCubic }, $Opacity: 2, $Brother: { $Duration: 1500, $Opacity: 2 } },
+
-
                //Rotate in+ out-
+
-
                { $Duration: 1500, x: -0.3, y: 0.5, $Zoom: 1, $Rotate: 0.1, $During: { $Left: [0.6, 0.4], $Top: [0.6, 0.4], $Rotate: [0.6, 0.4], $Zoom: [0.6, 0.4] }, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Top: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Brother: { $Duration: 1000, $Zoom: 11, $Rotate: -0.5, $Easing: { $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Shift: 200 } },
+
-
                //Fly Twins
+
-
                { $Duration: 1500, x: 0.3, $During: { $Left: [0.6, 0.4] }, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $Outside: true, $Brother: { $Duration: 1000, x: -0.3, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2 } },
+
-
                //Rotate in- out+
+
-
                { $Duration: 1500, $Zoom: 11, $Rotate: 0.5, $During: { $Left: [0.4, 0.6], $Top: [0.4, 0.6], $Rotate: [0.4, 0.6], $Zoom: [0.4, 0.6] }, $Easing: { $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Brother: { $Duration: 1000, $Zoom: 1, $Rotate: -0.5, $Easing: { $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Shift: 200 } },
+
-
                //Rotate Axis up overlap
+
-
                { $Duration: 1200, x: 0.25, y: 0.5, $Rotate: -0.1, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Top: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Brother: { $Duration: 1200, x: -0.1, y: -0.7, $Rotate: 0.1, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Top: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2 } },
+
-
                //Chess Replace TB
+
-
                { $Duration: 1600, x: 1, $Rows: 2, $ChessMode: { $Row: 3 }, $Easing: { $Left: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $Brother: { $Duration: 1600, x: -1, $Rows: 2, $ChessMode: { $Row: 3 }, $Easing: { $Left: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2 } },
+
-
                //Chess Replace LR
+
-
                { $Duration: 1600, y: -1, $Cols: 2, $ChessMode: { $Column: 12 }, $Easing: { $Top: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $Brother: { $Duration: 1600, y: 1, $Cols: 2, $ChessMode: { $Column: 12 }, $Easing: { $Top: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2 } },
+
-
                //Shift TB
+
-
                { $Duration: 1200, y: 1, $Easing: { $Top: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $Brother: { $Duration: 1200, y: -1, $Easing: { $Top: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2 } },
+
-
                //Shift LR
+
-
                { $Duration: 1200, x: 1, $Easing: { $Left: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $Brother: { $Duration: 1200, x: -1, $Easing: { $Left: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2 } },
+
-
                //Return TB
+
-
                { $Duration: 1200, y: -1, $Easing: { $Top: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $ZIndex: -10, $Brother: { $Duration: 1200, y: -1, $Easing: { $Top: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $ZIndex: -10, $Shift: -100 } },
+
-
                //Return LR
+
-
                { $Duration: 1200, x: 1, $Delay: 40, $Cols: 6, $Formation: $JssorSlideshowFormations$.$FormationStraight, $Easing: { $Left: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $ZIndex: -10, $Brother: { $Duration: 1200, x: 1, $Delay: 40, $Cols: 6, $Formation: $JssorSlideshowFormations$.$FormationStraight, $Easing: { $Top: $JssorEasing$.$EaseInOutQuart, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2, $ZIndex: -10, $Shift: -100 } },
+
-
                //Rotate Axis down
+
-
                { $Duration: 1500, x: -0.1, y: -0.7, $Rotate: 0.1, $During: { $Left: [0.6, 0.4], $Top: [0.6, 0.4], $Rotate: [0.6, 0.4] }, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Top: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2, $Brother: { $Duration: 1000, x: 0.2, y: 0.5, $Rotate: -0.1, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Top: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInQuad }, $Opacity: 2 } },
+
-
                //Extrude Replace
+
-
                { $Duration: 1600, x: -0.2, $Delay: 40, $Cols: 12, $During: { $Left: [0.4, 0.6] }, $SlideOut: true, $Formation: $JssorSlideshowFormations$.$FormationStraight, $Assembly: 260, $Easing: { $Left: $JssorEasing$.$EaseInOutExpo, $Opacity: $JssorEasing$.$EaseInOutQuad }, $Opacity: 2, $Outside: true, $Round: { $Top: 0.5 }, $Brother: { $Duration: 1000, x: 0.2, $Delay: 40, $Cols: 12, $Formation: $JssorSlideshowFormations$.$FormationStraight, $Assembly: 1028, $Easing: { $Left: $JssorEasing$.$EaseInOutExpo, $Opacity: $JssorEasing$.$EaseInOutQuad }, $Opacity: 2, $Round: { $Top: 0.5 } } }
+
-
            ];
+
-
 
+
-
            var _CaptionTransitions = [
+
-
            //CLIP|LR
+
-
            {$Duration: 900, $Clip: 3, $Easing: $JssorEasing$.$EaseInOutCubic },
+
-
            //CLIP|TB
+
-
            {$Duration: 900, $Clip: 12, $Easing: $JssorEasing$.$EaseInOutCubic },
+
-
 
+
-
            //DDGDANCE|LB
+
-
            {$Duration: 1800, x: 0.3, y: -0.3, $Zoom: 1, $Easing: { $Left: $JssorEasing$.$EaseInJump, $Top: $JssorEasing$.$EaseInJump, $Zoom: $JssorEasing$.$EaseOutQuad }, $Opacity: 2, $During: { $Left: [0, 0.8], $Top: [0, 0.8] }, $Round: { $Left: 0.8, $Top: 2.5} },
+
-
            //DDGDANCE|RB
+
-
            {$Duration: 1800, x: -0.3, y: -0.3, $Zoom: 1, $Easing: { $Left: $JssorEasing$.$EaseInJump, $Top: $JssorEasing$.$EaseInJump, $Zoom: $JssorEasing$.$EaseOutQuad }, $Opacity: 2, $During: { $Left: [0, 0.8], $Top: [0, 0.8] }, $Round: { $Left: 0.8, $Top: 2.5} },
+
-
 
+
-
            //TORTUOUS|HL
+
-
            {$Duration: 1500, x: 0.2, $Zoom: 1, $Easing: { $Left: $JssorEasing$.$EaseOutWave, $Zoom: $JssorEasing$.$EaseOutCubic }, $Opacity: 2, $During: { $Left: [0, 0.7] }, $Round: { $Left: 1.3} },
+
-
            //TORTUOUS|VB
+
-
            {$Duration: 1500, y: -0.2, $Zoom: 1, $Easing: { $Top: $JssorEasing$.$EaseOutWave, $Zoom: $JssorEasing$.$EaseOutCubic }, $Opacity: 2, $During: { $Top: [0, 0.7] }, $Round: { $Top: 1.3} },
+
-
 
+
-
            //ZMF|10
+
-
            {$Duration: 600, $Zoom: 11, $Easing: { $Zoom: $JssorEasing$.$EaseInExpo, $Opacity: $JssorEasing$.$EaseLinear }, $Opacity: 2 },
+
-
 
+
-
            //ZML|R
+
-
            {$Duration: 600, x: -0.6, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2 },
+
-
            //ZML|B
+
-
            {$Duration: 600, y: -0.6, $Zoom: 11, $Easing: { $Top: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2 },
+
-
 
+
-
            //ZMS|B
+
-
            {$Duration: 700, y: -0.6, $Zoom: 1, $Easing: { $Top: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2 },
+
-
 
+
-
            //ZM*JDN|LB
+
-
            {$Duration: 1200, x: 0.8, y: -0.5, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseOutCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Top: [0, 0.5]} },
+
-
            //ZM*JUP|LB
+
-
            {$Duration: 1200, x: 0.8, y: -0.5, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Top: [0, 0.5]} },
+
-
            //ZM*JUP|RB
+
-
            {$Duration: 1200, x: -0.8, y: -0.5, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Top: [0, 0.5]} },
+
-
 
+
-
            //ZM*WVR|LT
+
-
            {$Duration: 1200, x: 0.5, y: 0.3, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseInWave }, $Opacity: 2, $Round: { $Rotate: 0.8} },
+
-
            //ZM*WVR|RT
+
-
            {$Duration: 1200, x: -0.5, y: 0.3, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseInWave }, $Opacity: 2, $Round: { $Rotate: 0.8} },
+
-
            //ZM*WVR|TL
+
-
            {$Duration: 1200, x: 0.3, y: 0.5, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseInWave, $Top: $JssorEasing$.$EaseLinear }, $Opacity: 2, $Round: { $Rotate: 0.8} },
+
-
            //ZM*WVR|BL
+
-
            {$Duration: 1200, x: 0.3, y: -0.5, $Zoom: 11, $Easing: { $Left: $JssorEasing$.$EaseInWave, $Top: $JssorEasing$.$EaseLinear }, $Opacity: 2, $Round: { $Rotate: 0.8} },
+
-
 
+
-
            //RTT|10
+
-
            {$Duration: 700, $Zoom: 11, $Rotate: 1, $Easing: { $Zoom: $JssorEasing$.$EaseInExpo, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInExpo }, $Opacity: 2, $Round: { $Rotate: 0.8} },
+
-
 
+
-
            //RTTL|R
+
-
            {$Duration: 700, x: -0.6, $Zoom: 11, $Rotate: 1, $Easing: { $Left: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $Round: { $Rotate: 0.8} },
+
-
            //RTTL|B
+
-
            {$Duration: 700, y: -0.6, $Zoom: 11, $Rotate: 1, $Easing: { $Top: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic, $Opacity: $JssorEasing$.$EaseLinear, $Rotate: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $Round: { $Rotate: 0.8} },
+
-
 
+
-
            //RTTS|R
+
-
            {$Duration: 700, x: -0.6, $Zoom: 1, $Rotate: 1, $Easing: { $Left: $JssorEasing$.$EaseInQuad, $Zoom: $JssorEasing$.$EaseInQuad, $Rotate: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseOutQuad }, $Opacity: 2, $Round: { $Rotate: 1.2} },
+
-
            //RTTS|B
+
-
            {$Duration: 700, y: -0.6, $Zoom: 1, $Rotate: 1, $Easing: { $Top: $JssorEasing$.$EaseInQuad, $Zoom: $JssorEasing$.$EaseInQuad, $Rotate: $JssorEasing$.$EaseInQuad, $Opacity: $JssorEasing$.$EaseOutQuad }, $Opacity: 2, $Round: { $Rotate: 1.2} },
+
-
 
+
-
            //RTT*JDN|RT
+
-
            {$Duration: 1000, x: -0.8, y: 0.5, $Zoom: 11, $Rotate: 0.2, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseOutCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Top: [0, 0.5]} },
+
-
            //RTT*JDN|LB
+
-
            {$Duration: 1000, x: 0.8, y: -0.5, $Zoom: 11, $Rotate: 0.2, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseOutCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Top: [0, 0.5]} },
+
-
            //RTT*JUP|RB
+
-
            {$Duration: 1000, x: -0.8, y: -0.5, $Zoom: 11, $Rotate: 0.2, $Easing: { $Left: $JssorEasing$.$EaseLinear, $Top: $JssorEasing$.$EaseInCubic, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Top: [0, 0.5]} },
+
-
            {$Duration: 1000, x: -0.5, y: 0.8, $Zoom: 11, $Rotate: 1, $Easing: { $Left: $JssorEasing$.$EaseInCubic, $Top: $JssorEasing$.$EaseLinear, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Left: [0, 0.5] }, $Round: { $Rotate: 0.5 } },
+
-
            //RTT*JUP|BR
+
-
            {$Duration: 1000, x: -0.5, y: -0.8, $Zoom: 11, $Rotate: 0.2, $Easing: { $Left: $JssorEasing$.$EaseInCubic, $Top: $JssorEasing$.$EaseLinear, $Zoom: $JssorEasing$.$EaseInCubic }, $Opacity: 2, $During: { $Left: [0, 0.5]} },
+
-
 
+
-
            //R|IB
+
-
            {$Duration: 900, x: -0.6, $Easing: { $Left: $JssorEasing$.$EaseInOutBack }, $Opacity: 2 },
+
-
            //B|IB
+
-
            {$Duration: 900, y: -0.6, $Easing: { $Top: $JssorEasing$.$EaseInOutBack }, $Opacity: 2 },
+
             ];
             ];
Line 223: Line 117:
                     $TransitionsOrder: 1,                          //[Optional] The way to choose transition to play slide, 1 Sequence, 0 Random
                     $TransitionsOrder: 1,                          //[Optional] The way to choose transition to play slide, 1 Sequence, 0 Random
                     $ShowLink: true                                    //[Optional] Whether to bring slide link on top of the slider when slideshow is running, default value is false
                     $ShowLink: true                                    //[Optional] Whether to bring slide link on top of the slider when slideshow is running, default value is false
-
                },
 
-
 
-
                $CaptionSliderOptions: {                            //[Optional] Options which specifies how to animate caption
 
-
                    $Class: $JssorCaptionSlider$,                  //[Required] Class to create instance to animate caption
 
-
                    $CaptionTransitions: _CaptionTransitions,      //[Required] An array of caption transitions to play caption, see caption transition section at jssor slideshow transition builder
 
-
                    $PlayInMode: 1,                                //[Optional] 0 None (no play), 1 Chain (goes after main slide), 3 Chain Flatten (goes after main slide and flatten all caption animations), default value is 1
 
-
                    $PlayOutMode: 3                                //[Optional] 0 None (no play), 1 Chain (goes before main slide), 3 Chain Flatten (goes before main slide and flatten all caption animations), default value is 1
 
                 },
                 },
Line 249: Line 136:
             };
             };
-
             var jssor_slider1 = new $JssorSlider$("slider1_container", options);
+
             var jssor_slider2 = new $JssorSlider$("slider2_container", options);
 +
 
             //responsive code begin
             //responsive code begin
             //you can remove responsive code if you don't want the slider scales while window resizes
             //you can remove responsive code if you don't want the slider scales while window resizes
             function ScaleSlider() {
             function ScaleSlider() {
-
                 var parentWidth = jssor_slider1.$Elmt.parentNode.clientWidth;
+
                 var parentWidth = jssor_slider2.$Elmt.parentNode.clientWidth;
                 if (parentWidth)
                 if (parentWidth)
-
                     jssor_slider1.$ScaleWidth(Math.min(parentWidth, 600));
+
                     jssor_slider2.$ScaleWidth(Math.min(parentWidth, 600));
                 else
                 else
                     window.setTimeout(ScaleSlider, 30);
                     window.setTimeout(ScaleSlider, 30);
Line 273: Line 161:
         });
         });
     </script>
     </script>
-
 
     <!-- Jssor Slider Begin -->
     <!-- Jssor Slider Begin -->
     <!-- You can move inline styles to css file or css block. -->
     <!-- You can move inline styles to css file or css block. -->
Line 284: Line 171:
                 background-color: #000; top: 0px; left: 0px;width: 100%;height:100%;">
                 background-color: #000; top: 0px; left: 0px;width: 100%;height:100%;">
             </div>
             </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%;">
                 top: 0px; left: 0px;width: 100%;height:100%;">
             </div>
             </div>
Line 293: Line 180:
             overflow: hidden;">
             overflow: hidden;">
             <div>
             <div>
-
                 <a u=image href="#"><img src="../img/landscape/01.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>
             <div>
             <div>
-
                 <a u=image href="#"><img src="../img/landscape/02.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>
             <div>
             <div>
-
                 <a u=image href="#"><img src="../img/landscape/03.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>
             <div>
             <div>
-
                 <a u=image href="#"><img src="../img/landscape/05.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>
         </div>
         </div>
-
     
+
       
 +
        <!-- Bullet Navigator Skin Begin -->
 +
        <!-- jssor slider bullet navigator skin 01 -->
         <!-- bullet navigator container -->
         <!-- bullet navigator container -->
         <div u="navigator" class="jssorb01" style="position: absolute; bottom: 16px; right: 10px;">
         <div u="navigator" class="jssorb01" style="position: absolute; bottom: 16px; right: 10px;">
Line 311: Line 200:
             <div u="prototype" style="POSITION: absolute; WIDTH: 12px; HEIGHT: 12px;"></div>
             <div u="prototype" style="POSITION: absolute; WIDTH: 12px; HEIGHT: 12px;"></div>
         </div>
         </div>
-
        <!-- Bullet Navigator Skin End -->
 
-
        <!-- Arrow Navigator Skin Begin -->
 
         <!-- Arrow Left -->
         <!-- Arrow Left -->
         <span u="arrowleft" class="jssora05l" style="width: 40px; height: 40px; top: 123px; left: 8px;">
         <span u="arrowleft" class="jssora05l" style="width: 40px; height: 40px; top: 123px; left: 8px;">
Line 323: Line 210:
     </div>
     </div>
     <!-- Jssor Slider End -->
     <!-- Jssor Slider End -->
-
 
</html>
</html>

Latest revision as of 02:10, 18 October 2014