JavaScript

click()の使い方〜JavaScript

jQueryでクリックイベントを設置するには、on()を使ったりclick()を使ったりします。 今回はclick()の使い方の説明です。 通常、click()は次のような記述をします。jQuery基礎で学ぶおなじみの書き方です。 $(‘セレクター’).click(funct  >>続きを読む

jQuery〜マウスの移動が終わったら何か行う:mousemoveの応用

「マウスを動かしている間だけ何かを実行して、マウスの移動が終了すると何かの実行を止めたい」 例えば、マウスを移動している時だけ背景を「青色」にしてマウスを止めたら「ピンク色」にするということです。 この案件、簡単に実現できそうですが、結構難儀します。 マウスの移動を感知するイベントはmousemov  >>続きを読む

NTT docomoの雑談対話APIを使ったAI Bot

***NTT docomoの雑談対話APIは2018年6月末に廃止されたため、当該サンプルも削除しました。(2018年6月) NTT docomoの雑談対話APIを使ったAI Botを作りました。 AI Bot 雑談(NTT Docomo API) 投げかけた言葉に返事が返ってきます。ピント外れな内  >>続きを読む

jQueryで動的に高さを取得するときにハマる問題点

jQueryでブラウザのスクロール量を取得するには、スクロールすると発生する「scrollイベント」と「scrollTop()メソッド」を使うことで値を取得することができます。 また、ある要素の位置を動的に取得することは「offset()」を使うことで簡単に実現できます。 これらの仕組みを利用してW  >>続きを読む

slickの使い方〜jQuery

レスポンシブ対応のカルーセルを導入したい場合にjQueryのプラグインでslickがあります。 受講生の作品づくりにも人気のものですが、なぜか導入が上手くいかないという質問が多いので導入方法を書いておきます。 上手くいかない原因 ネット上で上位表示される記事で間違った設定の説明があるので混乱してしま  >>続きを読む

リクルートA3RTを使ったAI Bot

リクルートA3RTを使った簡単なAI Botを作成しました。サンプル Sample置き場に置いていますので、暇なとき会話してみてください。

not(“:animated”)とstop()の使い分けについて〜jQuery

not(“:animated”)とstop()の使い分けについて説明します。 :not(:animated)は、アニメーション中ではない時にアニメーションの命令を受け付けることです。 従って、現在行っているアニメーションは最後まで実施されます。しかし、そのアニメーション中には  >>続きを読む

Google Mapのスクロールを止める方法

Google Map共有機能の「地図を埋め込む」を使って、サイトにMapを表示する場合iframeが使用されます。 簡単に導入することができて便利に使えますのでさまざまなサイトで活用されています。 ところが、ひとつ問題点があります。スクロールをするときにMapの上にマウスのカーソルが重なった場合です  >>続きを読む