Template:Team:CBNU-Korea/css slide

From 2012.igem.org

(Difference between revisions)
(Created page with "<html> <head> <title>Title</title> <style type="text/css" media="screen"> .slides_container { width:570px; height...")
 
(46 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
<head>
<head>
-
        <title>Title</title>
+
     <style type="text/css" media="screen">
-
      
+
        .slides_container
-
        <style type="text/css" media="screen">
+
        {
-
             .slides_container {
+
             margin:0 auto;
-
                width:570px;
+
            width: 650px;
-
                height:270px;
+
            height: 200px;
-
             }
+
        }
-
             .slides_container div {
+
        .slides_container div
-
                width:570px;
+
        {
-
                height:270px;
+
            width: 650px;
-
                display:block;
+
            height: 200px;
-
             }
+
             display: block;
-
         </style>
+
        }
-
   
+
       
-
        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
+
        /*
-
        <script src="slides.js"></script>
+
    Slideshow 
-
      
+
        */
-
        <script>
+
       
-
            $(function(){
+
        #slides
-
                $("#slides").slides();
+
        {
-
            });
+
             position: relative;
-
        </script>
+
            #top: 15px;
-
    </head>
+
            #left: 4px;
 +
            z-index: 100;
 +
        }
 +
       
 +
        /*
 +
    Slides container
 +
    Important:
 +
    Set the width of your slides container
 +
    Set to display none, prevents content flash
 +
        */
 +
       
 +
        .slides_container
 +
        {
 +
            width: 650px;
 +
            overflow: hidden;
 +
            position: relative;
 +
            display: none;
 +
        }
 +
       
 +
        /*
 +
        Each slide
 +
        Important:
 +
        Set the width of your slides
 +
        If height not specified height will be set by the slide content
 +
        Set to display block
 +
        */
 +
       
 +
        .slides_container a
 +
        {
 +
            width: 650px;
 +
            height: 200px;
 +
            display: block;
 +
        }
 +
       
 +
        .slides_container a img
 +
        {
 +
             display: block;
 +
        }
 +
 
 +
/*
 +
Pagination
 +
*/
 +
 
 +
.pagination {
 +
margin:10px auto 0;
 +
width:100px;
 +
         padding-left: 38px;
 +
}
 +
 
 +
.pagination li {
 +
float:left;
 +
margin:0 1px;
 +
list-style:none;
 +
}
 +
 
 +
.pagination li a {
 +
display:block;
 +
width:12px;
 +
height:0;
 +
padding-top:12px;
 +
background-image:url(https://static.igem.org/mediawiki/2012/a/af/Pagination.png);
 +
background-position:0 0;
 +
float:left;
 +
overflow:hidden;
 +
}
 +
 
 +
.pagination li.current a {
 +
background-position:0 -12px;
 +
}
 +
 
 +
    </style>
 +
 
 +
    <script src="https://2012.igem.org/Template:Team:CBNU-Korea/js_jquery?action=raw"></script>
 +
    <script src="https://2012.igem.org/Template:Team:CBNU-Korea/js_slide?action=raw"></script>
 +
    <!--<script type="text/javascript" src="http://slidesjs.com/examples/standard/js/slides.min.jquery.js"></script>-->
 +
     <script>
 +
        $(function () {
 +
            $("#slides").slides();
 +
        });
 +
    </script>
 +
</head>
 +
 
</html>
</html>

Latest revision as of 07:03, 23 August 2012

Retrieved from "http://2012.igem.org/Template:Team:CBNU-Korea/css_slide"