jQuery(179)

178follower
ysugiyama12 さんのアバター 7views

jQuery UI のautocomplete機能

入力リストの候補を表示する時、通常のdatalistだとスマホなどでうまく表示できない場合があるので、かわりにjQuery UI のautocomplete機能を導入した。 下に一例を示す。 var list = []; list.pus... 2017年2月6日
huruhurupyotr さんのアバター 12views

return false、preventDefault()、stopPropagation()

おおまかに書くとこんな感じだそうです。 preventDefault():リンクの遷移などのイベントを無効にできる。 HTMLでリンクの形式になっていても、これが書いてあると踏んでも遷移しないということですね。 stopPro... 2017年2月2日
nissy さんのアバター 24views

bootstrap-slider スライドさせた後イベントを発火させる

タイトルの通りbootstrap-sliderで作られたスライダーにイベントを付加させるときの書き方です $(selector).slider().on(evnet,function () { //処理 }); ... 2017年1月26日
usanoko さんのアバター 24views

サイドメニューをスライドイン

$(function () { var $nav = $(".sidemenu"); $(".JS-navHoverBox").on({ "mouseenter": function(){ ... 2017年1月23日
usanoko さんのアバター 22views

アンカーリンクをスムーススクロール

$(function () { $('a[href^=#]').click(function() { var speed = 400; var href= $(this).attr("href... 2017年1月23日
usanoko さんのアバター 59views

ページトップへ戻るボタン

デモ https://usanoko.github.io/pagetopbtn/ HTML <!-- jQuery本体を読み込む --> <script type="text/javascript" src="http... 2017年1月23日
huruhurupyotr さんのアバター 18views

jQuery.post()とjQuery.ajax()

jQueryの日本語版リファレンスには、「$.postは$.ajaxの略記です」とあります。パッと見では理解できなかったのですが、それほどややこしい話でもありませんでした。 jQuery.post()は以下のように使います。   jQ... 2017年1月19日
harada さんのアバター 19views

AjaxでもURLを変更したい

pushStateという関数で、履歴やURLを操作することができるようです。 たとえばWordPressの検索画面をAjaxで動かしていたら、以下のようにすることで、 AjaxでもURLを変更することができます。 jQuery(docum... 2017年1月6日
nissy さんのアバター 125views

要素に雪を降らせる

LINEをいじっていたら雪が降っていたので、もしかしたらjQueryでできるのではと思ってCodepenを利用してやってみました! See the Pen vywdxd by Nissy (@nissy-02110114) on Code... 2016年12月25日
nissy さんのアバター 40views

jsとjQueryでforeachを行う

phpでよく使うforeachですが、jsとjQueryでもやっぱりできる!!とのことなのでハックに残しておきます。 【javascript】 //forEachメソッドを使う var a=[1,2,3,4,5] a.forEach(f... 2016年12月23日
harada さんのアバター 12views

シンプルなグラフを簡単に組み込める「jQuery Sparklines」

「jQuery Sparklines」を利用することで、シンプルがグラフを簡単に組み込むことができます。 利用方法 jQueryとjQuery Sparklinesを読み込みます。 jquery.min.js jquery.spark... 2016年12月19日
harada さんのアバター 50views

Slider for Bootstrapを利用して値をスライダーで絞り込む

Slider for Bootstrapを利用することで簡単に、値をスライダーで絞り込むことが出来ます。 利用方法 ファイルをダウンロードして、基本ファイルを読み込みます。 bootstrap-slider.css bootstrap... 2016年12月19日
nissy さんのアバター 14views

clickイベントに引数を渡す方法

初歩的内容ですが、よくやりたくなる操作なのでハックに残しておきます。 //以下のような要素を考える <p id='hoge'>click</p> //受け取った引数はevent.dataで引用する functio... 2016年12月15日
harada さんのアバター 127views

複数設置のslickでオリジナルの矢印アイコンを設置する

複数設置のslickでオリジナルのナビゲーションを設置し、それぞれ別に動かす方法です。 JavaScript var $sliders = $(".slide_list"); var $arrows = $('.arrows... 2016年12月12日
harada さんのアバター 49views

slickで最初の画像以外を遅延読み込みにする

slickではlazyLoadオプションが標準で用意されています。 slickのスライドですべての画像を一度に読み込むとページ表示完了までに時間がかかってしまいます。 そんなときこのlazyLoadオプションを利用することで、表示されていな... 2016年12月6日
harada さんのアバター 18views

jQueryで指定したclassが存在したら実行する分岐の書き方

以下のように記述することでclass="home"があるときだけ実行できます。 if($('.home').length) { //classが存在したら実行する } 参考:jQueryで特定の要素が存在するかどうかを判別する処理 c... 2016年12月1日
hirokas さんのアバター 85views

jQueryを使ったクロスドメインAjax通信

Cross Domain Ajax プラグインを用いると、クロスドメイン制約が解除される。 https://github.com/padolsey-archive/jquery.fn/blob/master/cross-domain-aj... 2016年11月29日
harada さんのアバター 53views

jQueryで動的に作成されたDOM要素にアクションを追加する

lightboxのウインドウで別のjQueryプラグインのアクションを実行したかったのですが、lightboxのウインドウは動的に作成されているため、普通の記述では効きませんでした。 以下の記述で無事実行できましたのでメモしておきます。 ... 2016年11月25日
harada さんのアバター 23views

jQueryでweb上の画像にPhotoshopのトーンカーブ設定を適用する方法

そんな魔法みたいなことが、jQuery filter.meというjQueryプラグインで実現できます。 サンプルはこちら 簡単さでは前回の読み込むだけで画像にInstagramのような加工ができるCSSライブラリ「CSSgram」にはか... 2016年11月25日
harada さんのアバター 31views

PHP&jQuery:URLにパラメータを付けてパラメータの内容をフォームで取得し値に挿入する

特定のIDを持つページでフォームへのリンクをクリックした場合にそのページのIDをURLで送信し、どのページからリンクを押したかをフォーム側で取得する方法です。 ※以下のjQuery記述はWordPressの管理画面用になっていますので適宜... 2016年11月17日