| MVC Classic ウィジェット > Wijsplitter > Wijsplitter チュートリアル > 手順 2：ウィジェットの初期化 |
前の手順では、垂直と水平スプリッタが表示される <div> 要素のマークアップを追加しました。ここでは、jQuery スクリプトを追加し、ウィジェットを初期化できます。
前の手順で追加した終了の </div>タグの後に、次の jQuery スクリプトを入力し、wijsplitter ウィジェットを初期化します。
| ソースビュー |
コードのコピー
|
|---|---|
<script id="scriptInit" type="text/javascript">
$(document).ready(function () {
$("#vsplitter").wijsplitter({ orientation: "vertical" });
$("#hsplitter").wijsplitter({ orientation: "horizontal" });
});
</script>
|
|
何かマークアップを <body> タグに追加し、CSS スタイリングをスプリッタに適用します。
| ソースビュー |
コードのコピー
|
|---|---|
<style type="text/css">
.splitterContainer
{
height: 210px;
}
#vsplitter, #hsplitter
{
width: 200px;
height: 200px;
}
.layout
{
float: left;
}
</style>
|
|