Team:UNAM-Genomics Mexico/Templates/Modeling
From 2011.igem.org
(Difference between revisions)
Line 26: | Line 26: | ||
<script src="https://github.com/syntacticx/livepipe-ui.git"></script> | <script src="https://github.com/syntacticx/livepipe-ui.git"></script> | ||
- | |||
- | |||
<script type="text/javascript"> | <script type="text/javascript"> | ||
//example 1 | //example 1 | ||
Line 68: | Line 66: | ||
}); | }); | ||
</script> | </script> | ||
+ | <style type="text/css"> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | .tabbed_images { | ||
+ | list-style:none; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | clear:both; | ||
+ | } | ||
+ | |||
+ | .tabbed_images li { | ||
+ | list-style:none; | ||
+ | float:left; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | } | ||
+ | |||
+ | .tabbed_images li a { | ||
+ | border:1px solid #ccc; | ||
+ | display:block; | ||
+ | float:left; | ||
+ | margin:0 10px 0 0; | ||
+ | } | ||
+ | |||
+ | .tabbed_images li a.active, | ||
+ | .tabbed_images li a:hover { | ||
+ | border:1px solid #333; | ||
+ | } | ||
+ | |||
+ | .tabbed_images li a img { | ||
+ | border:none; | ||
+ | padding:2px; | ||
+ | margin:0; | ||
+ | margin-bottom:-5px; | ||
+ | } | ||
+ | |||
+ | #image_1, | ||
+ | #image_2, | ||
+ | #image_3, | ||
+ | #image_4, | ||
+ | #image_5 { | ||
+ | margin-top:10px; | ||
+ | padding:2px; | ||
+ | border:1px solid #ccc; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
/*Horizontal Slider*/ | /*Horizontal Slider*/ | ||
.top-slider-main{width:860px; height:459px; overflow:hidden; position:relative; border:0px solid #000; background: #ff8888; | .top-slider-main{width:860px; height:459px; overflow:hidden; position:relative; border:0px solid #000; background: #ff8888; |
Revision as of 06:51, 26 September 2011
This is the simplest example of a set of tabs.
Note that the styling for the tabs is done with CSS, not the Control.Tabs script.
This example demonstrates scripting a Control.Tabs instance. Try clicking the links below, or changing the select box.
I am the second tab.
I am the third tab.
I am the fourth tab.
{{{content}}}