HTML5 × CSS3 × jQueryを真面目に勉強 – #6 パララックスエフェクトの基本 | DevelopersIO
そんな訳で、パララックス・スクロールについて少し学んでみたので、超初心者向け（※自分含む）のサンプルをいくつか紹介していきたいと思います。 はじめに - パララックスエフェクトについて パララックス（parallax）を直訳すると視差です。視差効果とは、視界が移動する際に各物体がそれぞれ異なったスピードでスクロールすることで、奥行き間をはじめとした視覚効果を指します。 アニメーションの世界ではディ○ニー映画で古くから使われていたり、ビデオゲームにおいても横スクロールアクションのゲームなどで昔から使われています。 JavaScript（jQuery）でパララックスエフェクト 1 | スクロール値を取得 どれだけスクロールしたかという値を取得します。これだけではまだパララックスも何もありませんが、全てはここから始まるのです。 $(function() { $(window).scroll(fu
jQuery | きほんのき
トップページ カテゴリー jQuery jQuery カテゴリーの記事一覧 スポンサーリンク 2014年11月27日 [jQuery] $.ajaxのコールバック関数にcontextで値を渡す 2014年11月08日 [jQuery] 文字列が含まれているかどうかの判定 2013年03月29日 [jQuery] rowspanを持つtableで行の表示・非表示を切り替える 2012年09月08日 [jQuery] find()とchildren()の使い分け 2012年09月04日 jQueryとPHPでAJAX通信を行う 2012年08月08日 [jQuery] $(‘form’).change()でフォーム全体の変更を監視する 2012年08月06日 [jQuery] 属性が存在するかどうかチェックするコード 2012年07月02日 [JS][jQuery] 要素の存在を確認する6通り
jQuery Mobile + document.write() で真っ白け
jQuery Mobileで妙なハマり方をしました。というわけで、メモ。 ※以降、jqmと書きます。 現象 とあるスクリプトとjqmの両方を読み込ませると、画面が真っ白になる。 スクリプトの中では”document.write() ”が使われています。 どうやらwriteした中身を「ページ」として生成してしまう様子。 [html title=”サンプル.html”] <p>文章1</p> <script type=’text/javascript’> document.write(‘<p>文章2</p>’); </script> [/html] このようなHTMLがあって、ブラウザで表示させると 「文章2」 しか画面に出力されません。本来ならば「文章1」「文章2」の両方が出力されるはず。 NGサンプルページ この現象はissueにもあがっていたようですが、報告数が少ないためか、closed
jQueryのload()とdocument.write()の共存
個人情報さらしてみる。 このページを管理している(現時点)のは俺なんだが、jQueryを使い始めた当時は何故か、真っ白なページに Powered by FC2.com とだけ表示されていて、大いに困った。いえでもちょろめでも火狐でもこうなる。 火狐に至っては「wyciwyg://103//http://～～」とかわけのわからんパスに飛ばされる始末。 で、最終的になんとかこのトラブルを(とりあえず)解決したのでここに記録しておく。 ずっと「読み込み中」だからFirebugが使えない、しかもwyciwyg://って… ローカルの鯖(Apache)では正しく動作していたのに、リモートでは動かない。 プログラミングではよくあることだと自分をなだめつつ調査開始。 まず、一瞬あるべき姿のページが表示されたのち、ページがリセットされて「Powered by FC2」の一行のみになる。 アドレスバーを見る
連載: IBM Watson Workspace #鬼わか アプリケーション開発: 第 7 回: IBM Watson Workspace で AI を利用したアプリ連携の実現 #鬼わか 解説（前編）
jQuery API 1.4.4 日本語リファレンス - StackTrace
add(expr) 要素集合に、条件式にマッチした要素集合を追加します。 add(expr, context) 要素集合に、指定されたコンテキストの条件式にマッチした要素集合を追加します。 addClass(class) 要素のクラスに、指定した CSS クラスを追加します。 addClass(fn) 要素のクラス属性に、指定した関数が返す CSS クラスを追加します。 after(content) マッチした要素の後（弟要素）に、指定した内容を追加します。 after(fn) マッチした要素の後（弟要素）に、指定した関数の内容を追加します。 jQuery.ajax(settings) HTTPリクエストを使用してデータを取得します。 ajaxComplete(handler) Ajaxリクエストが完了した時に実行するコールバック関数を登録します。 ajaxError(handler) A
jQuery UI.Layout Plugin を使って単一ページUIを作る - Pyro Memo
Google App Engineを使うようになって、リクエスト時間の節約のために重いページ（HTML）のロードは最初の1回だけにして、以降はページ遷移なしでAjaxでJSONのやりとりをしてビューを変更するような方法をとることが多くなった。 UIについても毎回デザインを考えるのも面倒だしロクなものができなかったので、jQueryUIとjQuery UI.Layout Pluginを利用するようになった。この2つを利用するだけでアプリケーション風のUIが実現できて、UI関連の悩みをほぼ解消してくれた。 jQueryUIはボタンやタブ、アコーディオンメニューなどのUIウィジェットを、jQueryUIのサイト上で作成したデザインテーマに合わせて表示してくれるので、統一感のあるデザインがてっとり早くできる。自分でカスタマイズした設定を再編集できるようにしてくれたらもっと便利なのだけど。http:
jQueryでディープコピー - loiter on the sideroad
javascriptのオブジェクトの複製を Object.clone = function(source) { return $.extend({},source); }で空オブジェクトにコピーしてましたが、 このままだとシャローコピーだったのでﾊﾏｯﾀﾖ。 ｶﾞｼｶｰｼ、jQueryのソース眺めてたら。。。ｵｯ $.extendの一つ目の引数にtrueを追加しとくとディープコピーになるっぽい。 ということで、 Shallow Clone Object.shallowCopy = function(source) { return $.extend({},source); } var a = {a:{a:1},b:{a:1}}; var b = Object.shallowCopy(a); b.a.a = 2; window.alert(a.a.a); //2 window.alert(b
jQuery-ui dialogでのメモリリーク
日本語の情報が見つからなかったので、メモとして。あまりこういうケースで使う人はいないのかなぁ？ jQuery1.4.2 jQuery-ui1.8.7でのお話。 jQuery-UIのdialogをmodalウィンドウで作成→消去→作成→消去と繰り返した場合、IEではメモリが解放されず、がんがん食い潰していくという現象。 どうも、IEではCSSでAlpha(opacity=..)を指定した画像を読み込むと、以後、それをDOM上から消去してもその分のメモリを解放してくれないとか。で、それがmodalウィンドウを作成する時に、背景のグレーがもろに指定している、と。 使わなくなったら消去した方がいいだろうと思ってたのが裏目に。。。とほ。なんか10Mずつぐらい増えていきましたよ。すごいね、これ。 回避策としては、jQuery-uiのCSSで下の、 .ui-widget-overlay { backgr
jQueryでスムーススクロール [Cool Web Window]
404 Not Found お探しのファイルは見つからないようです。 お手数ですが、下記リンクからトップページへお戻りください。 CoolWebWindow Copyright (C) Cool Web Window All Rights Reserved
jQuery Selectors
Toggle Button = $('selector').addClass('highlight').animate({ marginLeft: 10}, 'fast'); Download This Lab This is a paragraph, which means it is wrapped in <p> and </p>. Those "p" tags in the previous sentence are formatted as <code>. This is the first list item (<li>) in an unordered list (<ul>). This is the second list item. It has a link in it. This is the third list item. It has a class of "my
会社ロゴマーク デザインアーカイブ
Captcha security check laquu.com is for sale Please prove you're not a robot View Price Processing
今さら聞けないjQuery実行パターンまとめ :: 5509
なんとなく使っているだろう.ready()メソッドについて詳細に見てみましょう。 .ready()メソッド .ready()メソッドという呼び方がパッとしない人もいると思います。こういうのです↓ $(function(){ // .ready()が呼び出されたときに実行されるハンドラ }); jQueryを実行する際のおまじないみたいなものですね。これの中にjQueryコードを書いていくとページロード時（Documentの読み込みが完了時）に実行してくれます。 何気なく使ってる人も多いと思いますが、実際のところこれは何？ということで、少し掘り下げてみましょう。 .ready()を使う際の形式 jQuery APIによれば、以下の3つが.ready()として同じように使えるようです。 $(document).ready(handler) $().ready(handler) (推奨されていな
どんなフォームにも使えるjQueryのフォームバリデーション exValidation :: 5509
jquery.validation.jsというフォームバリデーションプラグインを公開していますが、使える場面が割と限定されてしまうような作りだったので、より幅広く使えるようにexValidationという名前で新しいjQueryプラグインとして作り直しました。伴って仕様や使い方が異なる部分も多いので、ドキュメントとして書いておきます。ただし前半のバリデーションルール周りは同じエンジンを使ってるので、ほぼ同じです。ちなみにすごい長いです。。 ルールを割り当てる際のclass名がhogeからchkhogeに代わりました。アップデートして使う場合は注意してください。 サンプル1: エラーを右上に表示 サンプル2: エラーを下に表示 トピックス ダウンロード 使い方 1. JSファイルを読み込む 2. 基本バリデーションルール 3. select, checkbox、radio、複数項目の場合 4
フォームで離脱させないためのjQueryプラグイン50選｜designaholic -Creative Column-
最近では、エントリーフォーム最適化（EFO）という施策も広まってきましたが、特に購入やサンプル請求、お問合せ等がコンバージョンとなっているサイトではフォームで離脱されてしまってはせっかくの広告や施策が水の泡になってしまいます。 ここではユーザーを離脱させないために気をつけたいポイントとそれを実現するために便利なjQueryのプラグインを紹介します。 まず、入力フォームを作成する際のポイントは、ユーザーにストレスを感じせない事です。ストレスの原因となるものは大きく言うと 入力しづらい、エラーメッセージがわかりづらい、といった操作に関するもの。 どこまでやれば完了なのかわかない、個人情報の扱いが心配、といった心理的なもの。 です。なのでこの点を解消させてあげるフォームを作成すればユーザーが離脱する可能性は下がりますね。 具体的なポイントは以下のような項目になります。 必須入力か
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IBM Developer
keydown event | jQuery API Documentation
エミナルクリニック心斎橋院の口コミ10選＆20代の本当の声
サービス終了のお知らせ
http://www.designwalker.com/2010/06/jquery-forms.html
