Team:KIT-Kyoto/Notebook-week11

From 2010.igem.org

(Difference between revisions)
 
(7 intermediate revisions not shown)
Line 1: Line 1:
-
<html>
+
{{Template:KIT-Kyoto/menu}}
-
 
+
<table border=0 width="965px" align="center"><tr><td>
-
 
+
[[Team:KIT-Kyoto|Home]] > [[Team:KIT-Kyoto/Note|Notebook]] > [[Team:KIT-Kyoto/Notebook|Lab Note]] > [[Team:KIT-Kyoto/Notebook-week8|Week8]]</td></tr></table>
-
<head>
+
<table border=0 width="965px" align="center"><tr><td width="165px" valign="top" align="left"><div>{{Template:KIT-Kyoto/menu1}}
-
 
+
</div></td><td width="800px" valign="top" align="left"><div id="MIGI">
-
<script type="text/javascript" src="jquery.js"></script>
+
{{Template:KIT-Kyoto/Labdaily}}
-
<script type="text/javascript" src="ddaccordion.js">
+
{{Template:KIT-Kyoto-week11}}
-
/***********************************************
+
</div></td></tr></table>
-
* Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
+
{{Template:KIT-Kyoto-1}}
-
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
+
-
* This notice must stay intact for legal use
+
-
***********************************************/
+
-
</script>
+
-
<script type="text/javascript" src="wrapscroll.js"></script>
+
-
 
+
-
<script type="text/javascript"><!--
+
-
ddaccordion.init({
+
-
  headerclass: "expandable",
+
-
  contentclass: "categoryitems",
+
-
  collapseprev: true,
+
-
  defaultexpanded: [0],
+
-
  animatedefault: false,
+
-
  persiststate: true,
+
-
  toggleclass: ["", "openheader"],
+
-
  togglehtml: ["suffix", "<img src='image/plus.gif' class='statusicon' />", "<img src='image/minus.gif' class='statusicon' />"],
+
-
  animatespeed: "normal"
+
-
})
+
-
// wrapScroll
+
-
var mov = new wrapScroll('accordion_menu','container','header');
+
-
mov.marginTop = 5;  //上からのマージンを指定(px)
+
-
//--></script>
+
-
 
+
-
 
+
-
+
-
+
-
<style type="text/css">
+
-
/* ▼　アコーディオンメニュー　▼ */
+
-
#accordion_menu{
+
-
  width: 180px; /*width of accordion menu*/
+
-
  background-color:#fff;
+
-
  letter-spacing:1px;
+
-
  margin:5px 10px;
+
-
}
+
-
/* アコーディオンのカテゴリの指定 */
+
-
#accordion_menu .menuheader{
+
-
  background-image: url(image/bg_menu.jpg);
+
-
  background-repeat: no-repeat;
+
-
  height:32px;
+
-
  margin-bottom: 3px;
+
-
  text-decoration: none;
+
-
  line-height: 32px;
+
-
  font-size: 16px;
+
-
  font-weight:bold;
+
-
  text-indent: 1.4em;
+
-
  color: #000;
+
-
  cursor: hand;
+
-
  cursor: pointer;
+
-
  /* ステータスアイコンを使用する場合 以下の2行が必要です。使用しない場合は削除しても構いません。 */
+
-
  display: block;
+
-
  position: relative;
+
-
}
+
-
#accordion_menu .menuheader:hover{
+
-
  color: #FF0;
+
-
}
+
-
/* openheader はカテゴリが開いている状態のCSS */
+
-
#accordion_menu .openheader{
+
-
  background-image: url(image/bg_menu.jpg);
+
-
  background-position: 0 -32px;
+
-
  background-repeat: no-repeat;
+
-
  color: #FFFFFF;
+
-
}
+
-
/* 子メニューの指定 */
+
-
#accordion_menu div.categoryitems ul{
+
-
  list-style-type: none;
+
-
  margin: 0;
+
-
  padding: 0;
+
-
  margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
+
-
}
+
-
/*ステータスアイコンのCSS*/
+
-
#accordion_menu div.menuheader .statusicon{
+
-
  position: absolute;
+
-
  top: 10px;
+
-
  left: 5px;
+
-
  border: none;
+
-
}
+
-
#accordion_menu div.categoryitems ul li{
+
-
  padding-bottom: 2px;
+
-
}
+
-
#accordion_menu div.categoryitems ul li a{
+
-
  color: #A70303;
+
-
  background: url(image/arrow.png) no-repeat 2px 5px;
+
-
  display: block;
+
-
  padding: 2px 0;
+
-
  padding-left: 19px;
+
-
  text-decoration: none;
+
-
  border-bottom: 1px solid #dadada;
+
-
  font-size: 14px;
+
-
  font-weight: bold;
+
-
}
+
-
#accordion_menu div.categoryitems ul li a:visited{
+
-
  color: #A70303;
+
-
}
+
-
#accordion_menu div.categoryitems ul li a:hover{
+
-
  color: #A70303;
+
-
  background-color: #eee;
+
-
}
+
-
/* ▲　アコーディオンメニュー ▲　ここまで */
+
-
</style>
+
-
</head>
+
-
 
+
-
<body>
+
-
 
+
-
 
+
-
<div id="accordion_menu">
+
-
<a href="http://sawa-s.com/"><div class="menuheader">HOME</div></a>
+
-
<div class="menuheader expandable">カテゴリ 1</div>
+
-
<div class="categoryitems">
+
-
  <ul>
+
-
  <li><a href="#">MENU 1-1</a></li>
+
-
  <li><a href="#">MENU 1-2</a></li>
+
-
  <li><a href="#">MENU 1-3</a></li>
+
-
  <li><a href="#">MENU 1-4</a></li>
+
-
  <li><a href="#">MENU 1-5</a></li>
+
-
  <li><a href="#">MENU 1-6</a></li>
+
-
  </ul>
+
-
</div>
+
-
<div class="menuheader expandable">カテゴリ 2</div>
+
-
<div class="categoryitems">
+
-
  <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>
+
-
  <li><a href="#">MENU 2-4</a></li>
+
-
  <li><a href="#">MENU 2-5</a></li>
+
-
  <li><a href="#">MENU 2-6</a></li>
+
-
  <li><a href="#">MENU 2-7</a></li>
+
-
  </ul>
+
-
</div>
+
-
 
+
-
<div class="menuheader expandable">カテゴリ 3</div>
+
-
<div class="categoryitems">
+
-
  <ul>
+
-
  <li><a href="#">MENU 3-1</a></li>
+
-
  <li><a href="#">MENU 3-2</a></li>
+
-
  <li><a href="#">MENU 3-3</a></li>
+
-
  <li><a href="#">MENU 3-4</a></li>
+
-
  </ul>
+
-
  <div style="text-align:center;padding:5px;"><img src="image/akafuji.jpg" width="150" /></div>
+
-
  <div style="padding:5px;font-size:11px;">メニュー内に写真を表示する事も可能です。</div>
+
-
</div>
+
-
 
+
-
<div class="menuheader expandable">サンプル</div>
+
-
<div class="categoryitems">
+
-
  <ul>
+
-
  <li><a href="collapseprev.html">複数のカテゴリを開く</a></li>
+
-
  <li><a href="defaultexpanded.html">開くカテゴリを固定</a></li>
+
-
  <li><a href="animatedefault.html">ロード後にアニメーションで開く</a></li>
+
-
  </ul>
+
-
</div>
+
-
 
+
-
<div class="menuheader" style="cursor: default">Always Displays</div>
+
-
<div style="padding:5px;font-size:11px;">
+
-
常に表示しておきたいテキスト・メールアドレス・カウンターなどをここに書く事が出来ます。<br />画像の挿入、リンクの設定、スタイルの指定も可能です。
+
-
</div>
+
-
 
+
-
<!-- / #accordion_menu --></div>
+
-
</body>
+
-
</html>
+

Latest revision as of 01:20, 21 October 2010



Home > Notebook > Lab Note > Week8


Retrieved from "http://2010.igem.org/Team:KIT-Kyoto/Notebook-week11"