Template:Team:KIT-Kyoto/mobile

From 2014.igem.org

(Difference between revisions)
Line 2: Line 2:
<head>
<head>
<meta name="viewport" content="width=device-width; initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
<meta name="viewport" content="width=device-width; initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 +
<script type="text/javascript">
 +
var checkwidth = function() {
 +
var browserwidth = $(window).width();
 +
if(browserwidth <= 568){
 +
$(function(){
 +
//オブジェクトを保存
 +
var accordionItem=$('#kit_article');
 +
//一旦全部消す
 +
accordionItem.find('p').hide();
 +
 +
//active要素を指定して開く
 +
var no=0;
 +
//accordionItem.find('h3').eq(no).addClass('active').next('p').show();
 +
 +
//click-action
 +
accordionItem.find('h3').click(function () {
 +
 +
//slide
 +
$(this).next('p').slideToggle('slow')
 +
.siblings('p:visible').slideUp('slow');
 +
//activeクラス切り替え
 +
$(this).toggleClass('active');
 +
$(this).siblings('h3').removeClass('active');
 +
 +
});
 +
});
 +
}
 +
});
 +
 +
$(function(){
 +
    checkwidth();
 +
    $(window).resize(checkwidth);
 +
});
 +
 +
</script>
<style type="text/css">
<style type="text/css">
@media screen and (max-width: 568px) {
@media screen and (max-width: 568px) {

Revision as of 16:54, 21 September 2014

Retrieved from "http://2014.igem.org/Template:Team:KIT-Kyoto/mobile"