JavaScript  :  jQuery

add addClass after ajax ajaxComplete animate append appendTo attr before bind blur cache change children click clipboard clone closest contents contextmenu cookie css csv datepicker dblclick delay die each empty eq error extend fadeIn fadeOut fadeTo fadeToggle filter find fn focus get getJSON hasClass hash height hide hover html if index innerHeight innerWidth insertAfter insertBefore is JSON keydown keypress keyup lazyload live load map masonry mousedown mousemove mouseout mouseover mouseup next nextAll not off offset on one outerHeight outerWidth parent parents parseInt position prepend prependTo prev prevAll prop queue ready remove removeAttr removeClass replace replaceAll resize scroll scrollLeft scrollTop select serialize show size skrollr slice slick slideDown slideToggle slideUp smoothscroll stop submit text Ticker toArrays toggle toggleClass touchend touchmove touchstart trigger unbind unload unwrap val width wrap wrapAll wrapInner xml

• jQuery アンド条件で要素を表示する
• タグのようにいくつかのキーワードが紐づく要素があり、それぞれ複数のタグを持つ可能性があるとき、ボタンを複数選択することで絞り込むUIのサンプルです。 例えばボタンが５つあり、要素が８こあるとします。 ボタンを押すと、押したキーワードに紐づく要素だけが表示されるようにします。 複数のキーワードを...
• 2023-11-29 23:04:02

• jQuery ローカルでリンク集
• ただのリンク集のHTMLですが、JSの配列を読み込むように作られたシンプルに整形したサンプルです。 業務用PCなどでウェブサービスの利用に制限がある時、あるいは自分用のリンクメモだからネットにあげたくないような時、ローカルでリンク集を作ることがよくあり...
• 2022-06-12 22:35:43

• JS スマホを振って音を出す
• スマホを振った時の加速度を検知して、音を鳴らすJSのサンプル。 このサンプルはスマホで確認できます。 iOSの場合は、一度加速度センサーの許可をするボタンがでるので、クリックしてください。 スマホを振ると、加速...
• 2021-06-05 12:48:41

• JS サウンドビジュアライザー
• 音を使ったビジュアル表現のサンプルです。 jQueryとhowler.jsを使ったサウンドビジュアライザーのサンプルコードの備忘録です。 音のスピードや音量調整も簡易的に付けています。 BGM ra...
• 2021-06-02 00:56:29

• jQuery CSVを参照する
• 同じサーバ内にあるCSVを参照して、パースするサンプルです。 サーバ内に置かれているCSVを読み込み、HTMLを組みます。 jQueryとjQuery-CSVというライブラリを利用します。 [[ id,name,price 1,A,100 2,B,150 3,C,...
• 2021-05-30 00:43:12

• jQuery セレクタでエスケープする文字
• jQueryを使っていて、HTMLのIDやクラスや属性を参照するときに記号がある時の注意です。 少しこんなのあったな、くらいに覚えておきたい内容です。 以下の...
• 2021-01-24 23:22:25

• jQuery XMLをパースする
• XMLファイルをJavaScriptのjQueryで解析し、情報を加工するサンプルです。 例えば以下のようなXMLがあるとします。 [[ <?xml version="1.0" encoding="UTF-8"?> <urlset> <url> <loc&...
• 2020-10-04 22:14:29

• jQuery 上部スクロールでローディングアニメ
• スマホで最上部までスクロールし、さらに引っ張ると更新されたり、データが読み込まれたりするUIがよくあります。 そのサンプルを作ってみました。 スマホ...
• 2020-08-11 23:50:19

• jQuery スクロールの値を取得する
• スクロースしたときの数値を取得して表示します。 開いているブラウザのwindowの一番上が０となります。 [[ $(window).scroll(function() { $(&...
• 2020-08-10 14:25:47

• jQuery 画像をサイズ変更してモーダル
• 小さな画像をクリックしたときに、その画像を大きくしてモーダル表示にするサンプルです。 一昔前は画像は必ずサムネイルを作って表示速度のため容量を削っていました。 でも今では数MBでもすぐにダウンロードできてしまいます。 そうなってくると...
• 2020-07-04 14:14:06