HTA と jQuery-ui tabs で遊んでみた。

HTAアプリケーション実行例

Windows7 には HTA ( HTML Application ) という遊び道具があります。
悪用されやすいですが、エディターで書いてすぐ実行できる強みもあります。
JScript VBScript も動くので tail -f アプリケーションならば
調べて簡単に作れるのではないでしょうか。

jQuery - 癒し、安らぎ、救い - ですが、jQuery-ui という
面白い代物 jQuery 用 script.aculo.us があるらしいです。
なので、遊んでみました。さっそくタブを作成しましょう！

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
    <meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
    <meta http-equiv="content-script-type" content="text/javascript">
    <meta http-equiv="content-style-type" content="text/css">
    <title>my monster application</title>
    <hta:application id="omyapp" 
        applicationname="monster" 
        border="thick"
        caption="yes"
        showintaskbar="yes"
        singleinstance="yes"
        sysmenu="yes"
        windowstate="normal">
    <style type="text/css">
        * { margin: 0; padding: 0; }
    </style>
    <link rel="stylesheet" type="text/css"
        href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" />
    <script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js"></script>
    <script type="text/javascript">
        window.resizeTo(600, 480)
        $(function() {
            $("div#tabs").tabs();
        });
    </script>
</head>
<body class="base">
    <div id="tabs">
        <ul>
            <li><a href="#tab01">tab01</a>
            <li><a href="#tab02">tab02</a>
        </ul>
        <div id="tab01">tab01</div>
        <div id="tab02">tab02</div>
    </div>
</body>
</html>

Google Libraries API からファイルを取得してます。
お世話様です！

jQuery-ui いいものですね。

以下のサイトは参考にさせていただきました！ありがとうございました。
MSDN - Introduction to HTML Applications (HTAs)
HTA:APPLICATIONタグ
 ASCII.jp - 長〜いページもスッキリ！jQueryでタブ表示