Team:KAIST Korea/Team KAIST

From 2012.igem.org

(Difference between revisions)
Line 103: Line 103:
 +
/* Lined Tab Navigation */
 +
.tab.line{padding:0 0 35px 0}
 +
.tab.line ul{position:relative;margin:0;padding:0;list-style:none;border-bottom:1px solid #ccc;font-family:Tahoma, Sans-serif;font-size:12px;*zoom:1}
 +
.tab.line ul:after{content:"";display:block;clear:both}
 +
.tab.line li{float:left;margin-bottom:-1px}
 +
.tab.line li a{position:relative;float:left;text-decoration:none;border:1px solid #eee;border-bottom-color:#ccc;background:#fafafa;color:#333}
 +
.tab.line li a span{display:inline-block;height:14px;padding:6px 25px 6px 25px;letter-spacing:-1px;cursor:pointer}
 +
.tab.line li ul{width:100%;position:absolute;top:40px;left:0;list-style:none;border:0;margin:0;padding:0;white-space:nowrap;overflow:hidden;*zoom:1}
 +
.tab.line li ul:after{content:"";display:block;clear:both}
 +
.tab.line li li{position:relative;left:-1px;padding:0 10px;border-left:1px solid #ddd;overflow:visible}
 +
.tab.line li li a{padding:0;margin:0;border:0 !important;color:#666 !important;font-weight:normal;background:transparent;letter-spacing:normal}
 +
.tab.line li.active a{border:1px solid #ccc;border-bottom:1px solid #fff;margin-top:-1px;background:transparent}
 +
.tab.line li.active a span{padding-top:7px;font-weight:bold}
 +
.tab.line li li a:hover,
 +
.tab.line li li a:active,
 +
.tab.line li li a:focus,
 +
.tab.line li li.active a{font-weight:bold;letter-spacing:-1px;color:#333 !important}
 +
.tab.line.jx{padding:0}
 +
.tab.line.jx ul{border:0}
 +
.tab.line.jx li{float:none}
 +
.tab.line.jx li a{float:none;display:block;font-weight:bold;color:#333;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important}
 +
.tab.line.jx li ul{position:static;display:block;padding:5px 0;left:0;top:0}
 +
.tab.line.jx li li{display:inline}
 +
.tab.line.jx li li a{display:inline;letter-spacing:normal;border:0 !important;font-weight:normal !important;color:#666 !important;background:none !important}
 +
.tab.line.jx li li a:hover,
 +
.tab.line.jx li li a:active,
 +
.tab.line.jx li li a:focus{text-decoration:underline}
</style>
</style>
Line 126: Line 153:
<div id="kaistcontent">
<div id="kaistcontent">
 +
<div class="tab line jx">
 +
<ul>
 +
<li><a href="#"><span>Activity 1</span></a>
 +
</br> 안녕하세용</br> hi</br>
 +
</li>
 +
<li><a href="#"><span>Activity 2</span></a>
 +
<ul>
 +
<li><a href="#">Menu 2-1</a></li>
 +
<li><a href="#">Menu 2-2</a></li>
 +
<li><a href="#">Menu 2-3</a></li>
 +
</ul>
 +
</li>
 +
<li><a href="#"><span>Activity 3</span></a>
 +
<ul>
 +
<li><a href="#">메뉴 3-1</a></li>
 +
<li><a href="#">메뉴 3-2</a></li>
 +
<li><a href="#">메뉴 3-3</a></li>
 +
</ul>
 +
</li>
 +
</ul>
 +
</div>
</br>
</br>
</br>
</br>
Line 135: Line 183:
</div>
</div>
</div>
</div>
 +
 +
 +
<script>
 +
jQuery(function($){
 +
// Lined Tab Navigation
 +
var tab_line = $('div.tab.line');
 +
var tab_line_i = tab_line.find('>ul>li');
 +
var tab_line_ii = tab_line.find('>ul>li>ul>li');
 +
tab_line.removeClass('jx');
 +
tab_line_i.find('>ul').hide();
 +
tab_line_i.find('>ul>li[class=active]').parents('li').attr('class','active');
 +
tab_line.find('>ul>li[class=active]').find('>ul').show();
 +
function lineTabMenuToggle(event){
 +
var t = $(this);
 +
tab_line_i.find('>ul').hide();
 +
t.next('ul').show();
 +
tab_line_i.removeClass('active');
 +
t.parent('li').addClass('active');
 +
return false;
 +
}
 +
function lineTabSubMenuActive(){
 +
tab_line_ii.removeClass('active');
 +
$(this).parent(tab_line_ii).addClass('active');
 +
return false;
 +
};
 +
tab_line_i.find('>a[href=#]').click(lineTabMenuToggle).focus(lineTabMenuToggle);
 +
tab_line_ii.find('>a[href=#]').click(lineTabSubMenuActive).focus(lineTabSubMenuActive);
 +
});
 +
</script>
 +
 +
</body>
</body>
</html>
</html>
{{:Team:KAIST_Korea/footer}}
{{:Team:KAIST_Korea/footer}}

Revision as of 09:49, 30 August 2012

KAIST Korea 2012 iGEM

Kaist Footer