Template:Slider

From 2014.igem.org

(Difference between revisions)
 
(51 intermediate revisions not shown)
Line 39: Line 39:
             x.find(".title_thumb_box").append('<div class="title_box"></div>');
             x.find(".title_thumb_box").append('<div class="title_box"></div>');
             x.find(".title_thumb_box").append('<div class="thumb_box"></div>');
             x.find(".title_thumb_box").append('<div class="thumb_box"></div>');
-
             x.find(".thumb_box").append('<span><img src="'+d+'carousel_back_normal.png" alt="previous"  class="thumb_p"/></span>');
+
             x.find(".thumb_box").append('<span><img src="https://static.igem.org/mediawiki/2014/9/91/Arrow_l.png" alt="previous"  class="thumb_p"/></span>');
             x.find(".title_thumb_box").css("background-color",sf);
             x.find(".title_thumb_box").css("background-color",sf);
             for (i = 0; i <= y-1; i++)
             for (i = 0; i <= y-1; i++)
             {
             {
-
                 x.find(".thumb_box").append('<span><img src="'+d+'carousel_circle_normal.png" class="thumb_num" alt="'+i+'" /></span>');
+
                 x.find(".thumb_box").append('<span><img src="https://static.igem.org/mediawiki/2014/c/c1/Carousel_circle_normal.png" class="thumb_num" alt="'+i+'" /></span>');
             }
             }
-
             x.find(".thumb_box").append('<span><img src="'+d+'carousel_next_normal.png" alt="next"  class="thumb_n"/></span>');
+
             x.find(".thumb_box").append('<span><img src="https://static.igem.org/mediawiki/2014/9/97/Arrow_r.png" alt="next"  class="thumb_n"/></span>');
             x.find(".thumb_box").children("span").children("img").click(
             x.find(".thumb_box").children("span").children("img").click(
                 function(){
                 function(){
Line 69: Line 69:
                 function(){
                 function(){
                     switch($(this).attr("class")){
                     switch($(this).attr("class")){
-
                         case "thumb_p":
+
                         case "thumb_p":ca
-
                             $(this).attr("src",d+"carousel_back_hoverhit.png");
+
                             $(this).attr("src","https://static.igem.org/mediawiki/2014/9/91/Arrow_l.png");
                             break;
                             break;
                         case "thumb_num":
                         case "thumb_num":
                             if(parseInt($(this).attr("alt")) != w){
                             if(parseInt($(this).attr("alt")) != w){
-
                                 $(this).attr("src",d+"carousel_circle_hoverhit.png");
+
                                 $(this).attr("src","https://static.igem.org/mediawiki/2014/2/28/Carousel_circle_hoverhit.png");
                             }
                             }
                             break;
                             break;
                         case "thumb_n":
                         case "thumb_n":
-
                             $(this).attr("src",d+"carousel_next_hoverhit.png");
+
                             $(this).attr("src","https://static.igem.org/mediawiki/2014/9/97/Arrow_r.png");
                             break;
                             break;
                     }
                     }
Line 85: Line 85:
                     switch($(this).attr("class")){
                     switch($(this).attr("class")){
                         case "thumb_p":
                         case "thumb_p":
-
                             $(this).attr("src",d+"carousel_back_normal.png");
+
                             $(this).attr("src","https://static.igem.org/mediawiki/2014/9/91/Arrow_l.png");
                             break;
                             break;
                         case "thumb_num":
                         case "thumb_num":
                             if(parseInt($(this).attr("alt")) != w){
                             if(parseInt($(this).attr("alt")) != w){
-
                                 $(this).attr("src",d+"carousel_circle_normal.png");
+
                                 $(this).attr("src","https://static.igem.org/mediawiki/2014/c/c1/Carousel_circle_normal.png");
                             }
                             }
                             break;
                             break;
                         case "thumb_n":
                         case "thumb_n":
-
                             $(this).attr("src",d+"carousel_next_normal.png");
+
                             $(this).attr("src","https://static.igem.org/mediawiki/2014/9/97/Arrow_r.png");
                             break;
                             break;
                     }
                     }
Line 136: Line 136:
                 left:-(w*parseInt(q))
                 left:-(w*parseInt(q))
             },600);
             },600);
-
             x.find(".thumb_box").children("span").children("img[class='thumb_num']").attr("src",d+"carousel_circle_normal.png");
+
             x.find(".thumb_box").children("span").children("img[class='thumb_num']").attr("src",d+"https://static.igem.org/mediawiki/2014/c/c1/Carousel_circle_normal.png");
-
             x.find(".thumb_box").children("span").children("img[class='thumb_num']").eq(w).attr("src",d+"carousel_circle_solid.png");
+
             x.find(".thumb_box").children("span").children("img[class='thumb_num']").eq(w).attr("src",d+"https://static.igem.org/mediawiki/2014/c/c4/Carousel_circle_solid.png");
             x.find(".title_box").html('<a href="'+x.find(".slides_box").children("ul").children("li").children("a").eq(w).attr("href")+'" style="color:'+stc+'">'+x.find(".slides_box").children("ul").children("li").children("a").eq(w).attr("title")+'</a>');
             x.find(".title_box").html('<a href="'+x.find(".slides_box").children("ul").children("li").children("a").eq(w).attr("href")+'" style="color:'+stc+'">'+x.find(".slides_box").children("ul").children("li").children("a").eq(w).attr("title")+'</a>');
              
              
Line 151: Line 151:
</script>
</script>
-
 
-
 
<style type="text/css">
<style type="text/css">
.webwidget_slideshow_dot{
.webwidget_slideshow_dot{
 +
    width: 490px !important;
 +
    height: 300px !important;
     padding: 0px;
     padding: 0px;
     margin-left: 19%;
     margin-left: 19%;
     margin-right: 19%;
     margin-right: 19%;
-
     margin-top: 250px !important;
+
     margin-top: 300px;
     position: relative;
     position: relative;
     font-family: Arial,Sans-Serif;
     font-family: Arial,Sans-Serif;
     font-size: 13px;
     font-size: 13px;
-
     z-index: 4 ! important;
+
     z-index: 1 ! important;
-
    width:800px !important;
+
}
}
.webwidget_slideshow_dot a{
.webwidget_slideshow_dot a{
Line 174: Line 173:
}
}
.webwidget_slideshow_dot .slides_box{
.webwidget_slideshow_dot .slides_box{
 +
    width: 490px !important;
 +
    height: 300px !important;
     padding: 0px;
     padding: 0px;
-
     margin: 250px;
+
     margin-top: 250px;
     overflow: hidden;
     overflow: hidden;
     position: absolute;
     position: absolute;
Line 211: Line 212:
}
}
.webwidget_slideshow_dot ul li{
.webwidget_slideshow_dot ul li{
-
     width: 800px;
+
     width: 490px;
     padding: 0px;
     padding: 0px;
     margin: 0px;
     margin: 0px;
Line 223: Line 224:
img.thumb_n {
img.thumb_n {
float:right;
float:right;
-
margin-right:30px;
+
margin-left: 50x;
width:4%;
width:4%;
}
}
img.thumb_p {
img.thumb_p {
float:left;
float:left;
-
margin-left:30px;
+
margin-right: 50px;
width:4%;
width:4%;
}
}
.title_thumb_box{
.title_thumb_box{
-
margin-bottom:25%;
+
margin-bottom: -230px;
 +
content: "fnskg";
}
}
#demo3 .title_thumb_box{
#demo3 .title_thumb_box{
-
margin-bottom:18%;
+
width: 490px !important;
-
}
+
height: 300px !important;
-
#demo4 .title_thumb_box{
+
-
margin-bottom:58%;
+
}
}
 +
img.thumb_num{display:none;}
img.thumb_num{display:none;}
Line 247: Line 248:
.slides_box{
.slides_box{
-
width:800px !important;
+
padding: 0;
-
height:800px !important;
+
width:490px !important;
 +
height:490px !important;
}
}
.slidex_box ul{
.slidex_box ul{
-
width:800px !important;
+
width:490px !important;
-
height:800px !important;
+
height:490px !important;
}
}
.slidex_box ul li{
.slidex_box ul li{
-
width:800px !important;
+
width:490px !important;
-
height:800px !important;
+
height:490px !important;
}
}
</style>
</style>

Latest revision as of 01:51, 18 October 2014