HTMLでコンボボックス風に マウス長押しで切替えてみる
HTMLのformタグにはコンボボックスがありません。codessさんのマウス長押しハンドリングのライブラリを使って、ちょい長押しでテキストボックスに切り替えてみた。IEでは動いているが、firefoxは長押しがきかず、chromeは切り替えがきかない。なんでだろう。
←サンプルデモ。マウスで長押しでトグル。
jQueryライブラリのmouse_action.jsは上記リンクにあるデモページからいただきました。
上のサンプルデモのソース
このサンプルでは使ってませんが、イベント発生元のノードオブジェクト(e)はこちらからでもアクセスできます。
mirrorManにも入れたのでversionは2.04です。IE6環境ではうまく動きませんでしたが、もう知りません。
←サンプルデモ。マウスで長押しでトグル。
jQueryライブラリのmouse_action.jsは上記リンクにあるデモページからいただきました。
上のサンプルデモのソース
<span class="mouseaction"> <select id="downlist"> <option value="クルーグマンと">クルーグマンと</option> <option value="池田信夫って">池田信夫って</option> <option value="似てる?">似てる?</option> </select> <input type=text id="txtbox" value=""/> </span>長押しイベントをアイヤーさせたいタグにclass="mouseaction"します。
<script type="text/javascript">
$('.mouseaction').mousedown(MouseAction._down);
$('.mouseaction').mouseup(MouseAction._up);
$('.mouseaction').mouseover(MouseAction._over);
$('.mouseaction').mouseout(MouseAction._out);
$('.mouseaction').click(MouseAction._click);
$(txtbox).toggle();
MouseAction.click = function(){;}
MouseAction.press = function(){
txtbox.value = downlist.options[downlist.options.selectedIndex].value;
$(downlist).toggle();
$(txtbox).toggle();
}
</script>
プルダウンリストで表示されている値を取ってテキストボックスの値にします。このサンプルでは使ってませんが、イベント発生元のノードオブジェクト(e)はこちらからでもアクセスできます。
mirrorManにも入れたのでversionは2.04です。IE6環境ではうまく動きませんでしたが、もう知りません。

