メッセージボードと記事のスクロールを分ける

★　メッセージボードと記事のスクロールを分ける

●　記事全体(.skinMainArea)にスクロールをつけると
　　メッセージ・記事（コメントを含む）がスクロール
　　されます。

　　メッセージボードと記事のスクロールを別にします。




①　下記をフリープラグインへ追加

<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type="text/javascript">
$(document).ready(function(){
$(".skinMessageBoard").insertBefore(".skinMainArea2");
$(".skinMessageBoard").css("display","block");
})
</script>

◆　説明

・　下記はフリープラグインに最初に１つあればＯＫです。

<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>


・　最初ＣＳＳでメッセージボードを非表示にします。
　　そして、スクリプトでメッセージボードを表示させます。

　　ページが表示されるときにきれいに表示させるためです。




②　下記をCSSの最後に追加

/* -------------------------------------------- */
/* メッセージボードと記事のスクロールを分ける 　*/
/* -------------------------------------------- */
.skinMainArea{/* 記事全体のスクロールをさせない */
height:100%;
}
.skinMessageBoard{/* メッセージボード */
width:470px;/* 幅 */
height:350px;/* 高さ */
overflow:auto;
display:none;/* 最初は表示しない。スクリプトで表示させる */
}
.skinMainArea2{/* 記事２をスクロールさせる */
height:400px;/* 高さ */
overflow:auto;
overflow-x:hidden;
}