jQueryでアニメーション処理（「.animate()」）完了後に別の処理を実行させる方法｜BLACKFLAG
jQueryでアニメーションを実行させる「.animate()」。 一つのfunctionの中で複数実行させることも可能だったりするのですが、 アニメーション実行後、実行したアニメーション処理が完了した時点で別の処理を実行させたい、 という場合がたまにあったりするのですが、その記述方法をつい忘れてしまうことがあるので、 ここにメモ書きがてら紹介してみます。 jQueryでアニメーション処理完了後に別の処理を実行 $(function(){ $(セレクタ).stop().animate({アニメーション処理},1000,function(){ ～ここに処理を記載～ }); }); 例えば、画像にマウスオーバーした際に、 画像をアニメーション拡大させ、 拡大処理完了後に影を付ける（CSS3で）場合は。 $(function(){ $('img').hover(function(){ $(thi
pjaxできれいなURL＋非同期画面遷移！ | ヘッドウォータースのブログ TechNote
こんにちは。荒井です。 Facebookもtwitterもgoogleも画面遷移のときには、非同期で次のページを読み込むような作りになってますね！ これは、ajaxで次のページを読み込むのと同時に「History API」というHTML5の機能を使って、URLを更新することで実現してます。 毎回全部読み直さないから通常の画面遷移よりも早いし、URLが変わるから履歴に残るし、良いことばっかり！！SEO的にも「#!」を使ったやつより良いよっていうのを何かで読みました！！！ これからWebサービスを作るなら、導入したいですね！！！ これpjaxを使えば簡単に導入できるんです！！！よし！！！ PJAX!! pjaxとは、GithubのChris Wanstrathって人が作ってるjqueryプラグインです。 上で説明した、History APIとajaxを使った非同期の画面遷移を簡単に導入すること
iPhone/Android/PC 対応。jQuery で書くタッチイベント
こんにちは！プロダクト企画担当の林です。 今回は、前回予告していた通り、タッチイベントについて書かせていただきます。 他所でもタッチイベントについて取り扱っていますが、当記事でのポイントは、 jQuery を使っている。（jQuery Mobile は不要です） iOS / Android で動作確認済み。 タッチできない PC の場合、マウスで動く。 この３点です。 こちらを実際に動作するコードにて解説します。 動作確認環境 タッチ環境 → iPhone / iPad / Android マウス環境 → Sleipnir / IE / Firefox / Google Chrome / Safari / Opera タッチイベントについて タッチイベントとは、スマートフォンなどで画面を直接指でタッチしたときに発生するイベントのことです。 イベントの種類 touchstart : タッチし
[jQuery] プラグインを使わずに横からスライドインするメニューを簡単に作る
Modified 2015-10-17 更新情報 メニュースライドイン時スクロールできるサンプルを追記しました。コメント欄での返答で誤りがあった箇所を削除しました。 コンテンツ 部分をクリックしても閉じることができるようにするコードを追記しました。 スマートフォンやレスポンシブサイトなどでよく見かける、メニューボタンをクリックするとコンテンツを押し出してメニューがスライドインしてくる動きを jQuery と CSS で作る方法です。やってみると意外と簡単なコードで作ることができます。 サンプルデモとダウンロード ◆ 横からスライドインするメニュー demo｜memocarilog このサンプルコードは以下よりダウンロードできます。 ◆ SaoriMiyazaki/SlideIn_Menu HTMLコード スライドインしてくるメニューとメニューボタンの記述をします。 <!-- スライドメニュ
![[jQuery] プラグインを使わずに横からスライドインするメニューを簡単に作る](https://cdn-ak-scissors.b.st-hatena.com/image/square/90e0d5fd2040a360e7449fe29a2efc39e3dd577c/height=288;version=1;width=512/https%3A%2F%2Fmemocarilog.info%2Fwp-content%2Fuploads%2F2014%2F11%2FjQueryicon.png)
スマホサイト制作に役立つ スライドメニュー 【mmenu】使い方 jQueryプラグイン | Glow-Factory
今回は、スマホサイト制作時に役に立つスライドメニューを実装出来るjQueryプラグイン【mmenu】の使い方のご紹介です。 どんなスライドメニューかといいますと、指定したメニューが左右からスライドして表示されるメニューを実装出来ます。 gmailのアプリをインストールされている方はピンと来るかもしれません。 利用も簡単に実装出来ますし、オススメしたいポイントが指定したナビ要素を自動的にCSSでスタイルしてくれます。 さらにメニューのサブメニューも自動でドロップダウンのようなスタイルも実装してくれます。 また、指定のCSSを読み込みオプションを指定すればナビのスタイルのテーマも変更が可能となってます。 上記の用にこちらのjQueryプラグインは、特定のCSSを読み込みオプションを指定すれば、エフェクトの追加やスタイルのテーマの追加が出来ます。 デモサイトも下記にご用意しておりますので、ご参考
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
プラグインやチュートリアル 25