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>
-
 
-
<style type="text/css">
 
<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

UNAM-Genomics_Mexico

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}}}