Team:ULB-Brussels/Template

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
<!--init and scripts -->
<!--init and scripts -->
-
<script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jquery-1.9.1.min.js"></script>
+
     <<script type="text/javascript" src="https://static.igem.org/mediawiki/2014/7/7f/Slider.jpg"></script>
-
     <script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jssor.core.js"></script>
+
-
    <script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jssor.utils.js"></script>
+
-
    <script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jssor.slider.js"></script>
+
     <script>
     <script>
         jssor_slider1_starter = function (containerId) {
         jssor_slider1_starter = function (containerId) {
-
 
             var options = {
             var options = {
-
                 $AutoPlay: false,
+
                 $DragOrientation: 3,
-
                 $SlideDuration: 800,
+
                 $ArrowNavigatorOptions: {
-
                $BulletNavigatorOptions: {
+
                     $Class: $JssorArrowNavigator$,
-
                     $Class: $JssorBulletNavigator$,
+
                     $ChanceToShow: 2,
                     $ChanceToShow: 2,
-
                     $AutoCenter: 1,
+
                     $AutoCenter: 0,
-
                     $Steps: 1,
+
                     $Steps: 1
-
                    $Lanes: 1,
+
-
                    $SpacingX: 10,
+
-
                    $SpacingY: 10,
+
-
                    $Orientation: 1
+
                 }
                 }
             };
             };
             var jssor_slider1 = new $JssorSlider$(containerId, options);
             var jssor_slider1 = new $JssorSlider$(containerId, options);
-
         }
+
         };
     </script>
     </script>
<!--main content -->
<!--main content -->
Line 31: Line 22:
<tr><th><table style="background-color:#ebebeb;" width="90%"  align="center">
<tr><th><table style="background-color:#ebebeb;" width="90%"  align="center">
<!-- 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. -->
-
     <div id="slider1_container" style="position: relative; width: 910px;
+
     <div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 1024px;
-
         height: 300px; overflow: hidden; margin-left: auto; margin-right: auto">
+
         height: 300px; ">
-
+
 
-
         <!-- Slides Container -->  
+
         <!-- Slides Container -->
-
         <div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width: 910px; height: 300px;
+
         <div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width: 1024px; height: 300px;
             overflow: hidden;">
             overflow: hidden;">
 +
            <div><img u="image" src="https://static.igem.org/mediawiki/2014/8/82/ULB2014PLACEHOLDER2.png" /></div>
             <div><img u="image" src="https://static.igem.org/mediawiki/2014/8/87/ULB2014PLACEHOLDER1.png" /></div>
             <div><img u="image" src="https://static.igem.org/mediawiki/2014/8/87/ULB2014PLACEHOLDER1.png" /></div>
-
            <div><img u="image" src="https://static.igem.org/mediawiki/2014/8/82/ULB2014PLACEHOLDER2.png" /></div>
 
         </div>
         </div>
-
 
+
       
-
         <!-- Bullet Navigator Skin Begin -->
+
         <!-- Arrow Navigator Skin Begin -->
         <style>
         <style>
-
             /* jssor slider bullet navigator skin 05 css */
+
             /* jssor slider arrow navigator skin 03 css */
             /*
             /*
-
             .jssorb05 div          (normal)
+
             .jssora03l              (normal)
-
             .jssorb05 div:hover    (normal mouseover)
+
             .jssora03r              (normal)
-
             .jssorb05 .av          (active)
+
             .jssora03l:hover        (normal mouseover)
-
             .jssorb05 .av:hover     (active mouseover)
+
             .jssora03r:hover       (normal mouseover)
-
             .jssorb05 .dn          (mousedown)
+
             .jssora03ldn            (mousedown)
 +
            .jssora03rdn            (mousedown)
             */
             */
-
             .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av
+
             .jssora03l, .jssora03r, .jssora03ldn, .jssora03rdn
             {
             {
-
                 background: url(https://static.igem.org/mediawiki/2014/c/c2/ULB2014BULLETS2.png) no-repeat;
+
            position: absolute;
 +
            cursor: pointer;
 +
            display: block;
 +
                 background: url(https://static.igem.org/mediawiki/2014/d/d3/ULB2014ARROWS.png) no-repeat;
                 overflow:hidden;
                 overflow:hidden;
-
                cursor: pointer;
 
             }
             }
-
             .jssorb05 div { background-position: -7px -7px; }
+
             .jssora03l { background-position: -3px -33px; }
-
             .jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
+
             .jssora03r { background-position: -63px -33px; }
-
             .jssorb05 .av { background-position: -67px -7px; }
+
            .jssora03l:hover { background-position: -123px -33px; }
-
             .jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }
+
             .jssora03r:hover { background-position: -183px -33px; }
 +
             .jssora03ldn { background-position: -243px -33px; }
 +
            .jssora03rdn { background-position: -303px -33px; }
         </style>
         </style>
-
         <!-- bullet navigator container -->
+
         <!-- Arrow Left -->
-
         <div u="navigator" class="jssorb05" style="position: absolute; bottom: 16px; right: 6px;">
+
         <span u="arrowleft" class="jssora03l" style="width: 55px; height: 55px; top: 123px; left: 8px;">
-
            <!-- bullet navigator item prototype -->
+
        </span>
-
            <div u="prototype" style="POSITION: absolute; WIDTH: 16px; HEIGHT: 16px;"></div>
+
        <!-- Arrow Right -->
-
         </div>
+
        <span u="arrowright" class="jssora03r" style="width: 55px; height: 55px; top: 123px; right: 8px">
-
         <!-- Bullet Navigator Skin End -->
+
         </span>
-
 
+
         <!-- Arrow Navigator Skin End -->
-
         <a style="display: none" href="http://www.jssor.com">carousel slider</a>  
+
         <a style="display: none" href="http://www.jssor.com">carousel slider</a>
-
         <!-- Trigger -->  
+
         <!-- Trigger -->
         <script>
         <script>
             jssor_slider1_starter('slider1_container');
             jssor_slider1_starter('slider1_container');
-
         </script>  
+
         </script>
-
     </div>  
+
     </div>
-
     <!-- Jssor Slider End -->  
+
     <!-- Jssor Slider End -->
<!--navigation menu -->
<!--navigation menu -->
<td align="center" colspan="3">
<td align="center" colspan="3">

Revision as of 21:03, 8 July 2014

<

carousel slider
Home Team Official Team Profile Project Parts Modeling Notebook Safety Attributions Français Dutch

Retrieved from "http://2014.igem.org/Team:ULB-Brussels/Template"