カテゴリー : JavaScript

[jQuery] スクロール中に特定の要素を固定するプラグイン「hcSticky」

スクロール中に特定の要素を固定するjQueryプラグイン「hcSticky」が便利だったのでご紹介します。

hcSticky – jQuery Floating Sticky Plugin | Some Web Log

特定の要素に hcSticky() を呼ぶだけで、スクロール時に要素を固定してくれます。

$('#sidebar').hcSticky();

使い方がシンプルでおすすめです。

[jQuery] Minimalect で onChange イベントを発生させる

フォームのselect要素を綺麗に表示させる jQuery ライブラリ「Minimalect」で onChange イベントを発生させる方法をメモ。

$('#js-target-select').minimalect({
  onchange: function() {
    $('#js-target-select').trigger('change');
  }
});
 
$('#js-target-select').change(function(){
  // do onchange event
});

上記のように Minimalect の onchange で select の onchange を発火させればいいみたい。


参考情報

jQuery Minimalectのonchange – プログラミングメモ

[jQuery] mouseover/mouseout と mouseenter/mouseleave の違い

jQuery のイベント mouseover/mouseout, mouseenter/mouseleave の違いを知らずに、かなりハマってしまった…。

下記のサイトが分かりやすく説明してくださってました。

DOM Leve3 イベント mouseover/mouseout, mouseenter/mouseleave それぞれの違いについて – 今日もスミマセン。

mouseenter/mouseleave イベントの方が、利用用途として直感的ですね。

mouseover/mouseout は、内部のDOMを出入りするときもイベントが発火してしまうので、思わぬ挙動をしてしまって結構悩みました。

[JavaScript] モバイルのタップイベントを高速化するライブラリ「fastclick.js」

モバイルのタップイベントを高速化するJavaScriptライブラリ「fastclick.js」が便利そうなのでメモ。

ftlabs/fastclick

スマートフォンwebのタップイベントを高速化するライブラリ"fastclick.js"をさわってみた – ushisantoasobu's blog

[jQuery] Minimalect で値の変更を反映させる方法

フォームのselect要素を綺麗に表示させる jQuery ライブラリ「Minimalect」で、値の変更を反映する方法をメモ。

$("#myselect").val("newvalue").change();

.val() だけでは値はセットされるが表示が変わらないので、.change() で変更したことを教えて上げる必要があるみたいです。


参考情報

Minimalect by groenroos