概要
まめこらいぶらり、通称mmkliveraryはまめこの制作に必要なものだけを詰め込んだスクリプト（にする予定）です。
他のライブラリ無しで動くことを目標においています。
設置方法
- ファイル一式をダウンロードします。
- mmk.jsを使用したいHTMLファイルの</body>手前に記載します。
<script type="text/javascript" src="js/mmkLiverary001-min.js"></script>
</body>
</html> - 適用させたい機能に対応したclassを該当部分に当て込んでください。詳細は以下で説明します。
機能説明
ロールオーバー
概要
****_on.jpg（拡張子はgif,jpg,png対応）と名前をつけたロールオーバー画像 を用意して、img要素にclass="wdBtn"と設定することでロールオーバー機能を付けることが出来ます。
サンプル
HTMLソース
<img src="img/btn.gif" alt="" class="wdBtn">
用意する画像
btn.gif
btn_on.gif
カレント処理
概要
ナビゲーションなど、現在のページをハイライトしたい場合があります。a要素で自分にリンクしている場合、内包するimg要素をハイラ イト画像（_onのついた画像）に変更します。またa要素にはclass="current"が付加されます。
サンプル
HTMLソース
<a href="./" class="current"><img
src="img/btn_on.png" alt=""></a>
用意する画像
btn.gif
btn_on.gif
偶数奇数処理
概要
リストや表で交互に背景色などを指定したい場合がよくあります。その場合、親要素にclass="wdOE"設 定することで、その子要素に奇数(odd)と偶数 (even)のクラスを追加します。
サンプル
- リスト
- リスト
- リスト
- リスト
HTMLソース
実行前
<ul class="wdOE">
<li>リスト</li>
<li>リスト</li>
<li>リスト</li>
<li>リスト</li>
</ul>
実行後
<ul class="wdOE">
<li class="odd">リスト</li>
<li class="even">リスト</li>
<li class="odd">リスト</li>
<li class="even">リスト</li>
</ul>
ボタンホバー処理
概要
inputタグで、type="submit"のものに限り、カーソルを合わせたときに、hoverのクラスをつけて、擬似的 に:hoverを古いブラウザでも動くようにします。このスクリプトだけは、何もclassを指定しなくて良いです。
サンプル
HTMLソース
通常時
<input type="submit" value="テストボタン">
マウスホバー時
<input type="submit" value="テストボタン" class="hover">
高さそろえ
概要
兄弟要素同士の高さをそろえたい時に、その親要素にclass="wdFHP"を、高さをそろえた い子要素にはclass="wdFHC"をつけることによって高さがそろいます。
サンプル
afefe
a
f
efe
f
efe
a
f
e
f
e
f
e
f
e
afe
fe
fe
HTMLソース
<div class="wdFHP">
<div class="wdFHC">afefe</div>
<div>a<br>f<br>efe</div>
<div class="wdFHC">a<br>f<br>e<br>f<br>e</div>
<div class="wdFHC">afe<br>fe</div>
</div>