mocha UIでウィンドウを表示するテスト

ブラウザの右端に表示されるページ全体に対するスクロールバーを削除

cssフォルダ内のmocha.cssを開いてください。

html, body {
height: 100%;
overflow: auto; /* Removes empty vertical scrollbars in IE */
}

15行目あたりに上記の表示があると思います。その中の
overflow: auto; /* Removes empty vertical scrollbars in IE */
を削除してください。

これだけで、右に表示されるスクロールバーは、表示されなくなります。
ただし、同時に、削除する前までウィンドウがスクロールしても表示されていたのですが、スクロールするとウィンドウは上部に取り残される状態となります。

まだ、試していませんが、回避方法としては、class="mocha"を設定したdivに対して、スタイルシートのpositionで指定してあげれば大丈夫だと思います。

mocha UIでウィンドウを表示するテスト

テストのウィンドウ

divにclassのmochaを指定。idは任意です。

もう一つのウィンドウ

このようにウィンドウを並べることも出来ますし、重ねることもできます。また、minimizeのボタンは、このサンプルでは利用できません。
行が多くなれば、右にスクロールバーが表示されます。

行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。
行が多くなれば、右にスクロールバーが表示されます。

最後のウィンドウ

当然太字など、ウィンドウ内には普通のHTMLが表示できます。