リストボックス型のプルダウンメニュー。
サンプル
↓↓↓↓↓↓
※各項目へリンクが貼っていません。移動したら、ブラウザの「戻る」ボタンで戻ってきて下さい。
ソースはこんな感じで。赤字の部分を変更れば、OK。
——————————————————————————————
<form>
<select onChange=”location.href=value;”>
<option value=”#”>メニュー</option>
<option value=”page1.html“>ページ1に移動します</option>
<option value=”page2.html“>ページ2に移動します</option>
<option value=”page3.html“>ページ3に移動します</option>
</select>
</form>
——————————————————————————————–
これでも一応JavaScriptである。
onChange=”location.href=value;”
の部分がそうだ。
スタイルシートを適応すれば次のような事もでlきる。
サンプル
↓↓↓↓↓↓
※各項目へリンクが貼っていません。移動したら、ブラウザの「戻る」ボタンで戻ってきて下さい。
htmlソース
——————————————————————————————
<form>
<select onChange=”location.href=value;”>
<option value=”#”>メニュー</option>
<option value=”page1.html” class=”red”>ページ1に移動します</option>
<option value=”page2.html” class=”blue”>ページ2に移動します</option>
<option value=”page3.html” class=”red”>ページ3に移動します</option>
</select>
</form>
——————————————————————————————–
これに次のスタイルシートを適応しただけである。
——————————————————————————————–
option.red {
background-color: #ffffcc;
color: red;
}
option.blue {
background-color: #ccffcc;
color: blue;
}
——————————————————————————————-