なぜAmazonのメガドロップダウンメニューはスムーズに操作できるのかという秘密
日本のAmazonでも採用されているメガドロップダウンメニューについて、なぜAmazonのメニューはユーザーが使いやすくできているのかという秘密が明らかになりました。ユーザビリティを改善することが至上命題のネットショッピング系サイトにとっては非常に有益な知識となっています。 Breaking down Amazon’s mega dropdown - Ben Kamens http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown まずこれがAmazonの左上にあるカテゴリーを一覧化したメガドロップダウンメニュー。日本のAmazonにも同様のメニューが採用されており、マウスカーソルを上に持っていくと実にスムーズに動きます。 通常のメニューの場合、以下のようにして少し遅れてサブメニューが開くようになっています。 な
爆速でわかるjQuery.Deferred超入門
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo!デベロッパーネットワークの中野(@Hiraku)です。これまで、JavaScriptで非同期処理を書く上での問題として、コールバック地獄やエラー処理に例外が使えないことなどを解説してきました。 これらの問題に対処するライブラリの1つであるjQuery.Deferredに関して、もう少し丁寧に解説いたします。なお、jQueryのバージョンは記事執筆時点の最新である、1.9.1を想定しています。 jQuery.Deferredとは jQuery.DeferredとはjQueryのバージョン1.5から導入された、非同期処理をうまく扱うための標準モジュールです。使いこなすことで、以下のような効果が見込めます。 非同期処理を連結
Masato Kinugawa Security Blog: jQuery Mobile 1.2 Beta未満は読み込んでいるだけでXSS脆弱性を作ります
(2012/9/25 最後に重要な追記があります。 ) jQuery Mobile 1.2 Betaがさきほどリリースされたようです。 タイトルの通り、それに満たないバージョンのjQuery Mobileには読み込んでいるだけでXSS脆弱性を作ってしまう問題があります。お使いの方はアップデートをお勧めします。 jQuery Mobile 1.2 Beta Released | jQuery Mobile http://jquerymobile.com/blog/2012/09/05/jquery-mobile-1-2-beta-released/ 以前の記事で触れた、一部のブラウザのlocation.hrefの挙動に絡むXSSが修正されています。 以下の件とは別の修正であることに注意してください。 jQuery MobileのXSSについての解説 - 金利0無利息キャッシング – キャッシ
jQuery MobileのテーマにMetroスタイルが登場。Microsoft Open Technologiesが発表
jQuery MobileのテーマにMetroスタイルが登場。Microsoft Open Technologiesが発表 HTML5のタグを記述することで容易にモバイル対応のアプリケーションが開発できるフレームワーク「jQuery Mobile」に、マイクロソフトのタッチインターフェイスである「Metroスタイル」に対応したテーマが追加されたことがブログ「More news from MS Open Tech: announcing the open source Metro style theme for jQuery Mobile」で明らかにされました。 このブログを投稿したAbu Obeida Bakhach氏は、先月マイクロソフトがオープンソースや標準規格などに対応するために設立した企業Microsoft Open Technologies,Incの一員です。 Metroスタイル
CSS で作るスマートフォン向け片手操作メニュー
ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。 久々にこの手のネタ書いた気がしますけども… ちょっとしたお遊びなんですが、普段は画面の下の隅に隠れてて、クリック （タップ） で展開、いくつかのショートカットメニューが表示される、しかもスマートフォンだと片手だけで操作しやすいみたいな UI を CSS と超簡単な JavaScript （jQuery 使用） で作ってみたので紹介。多分言葉で言っても伝わりにくいと思いますので実際のサンプルをまずは見てみてください。 CSS で作るスマートフォン向け片手操作メニュー サンプル 現在最新版の Firefox
jQueryのbind/live/delegateの違いまとめ、と新API .on()の使い方 - y-kawazの日記
jQueryのイベント記述方法はいくつかあり、大雑把におさらいしたのが以下の3パターンです。 まず一番基本的なのが $("a").click(fn) や $("a").bind('click', fn) です。click(fn)はbind('click', fn)の省略形です。 次にjQuery1.3で $("a").live("click", fn) という機能が出来ました。liveの良いところはDOM操作で出たり消えたりするエレメントに対して再バインド無しでイベント定義ができる利便性と、内部的にはbind個所がdocumentの1か所になり複数個所へのbindが無くなることによるメモリ効率と実効速度の向上です。 更にjQuery1.4.2で $("#foo").delegate("a", "click", fn) という書き方が出来るようになりました。これは特定要素以下に限定するliv
Html5 Css3 is under construction
Thank you for being patient. We are doing some work on the site and will be back shortly.
タイプライターっぽいエフェクトを実行できる jq.typewrite :: 5509
今さらなんでもないメソッドですけど、せっかく作ったので記事書いておきます。対象要素内のテキストを一文字ずつ表示するだけです。 jq.typewrite のサンプル ホスト / ダウンロード 5509/jq.typewrite – GitHub ダウンロード 使い方 そのままつかう 最初に $.typewrite(jQueryオブジェクト) で初期化しておきます。あとは任意のタイミングで .play() メソッドでエフェクトを実行できます。 .play(4) のように実行時に duration を決めることもできます。 .play() メソッドは jQuery Deferred オブジェクトを返すので、完了時に何かしたいときは .done() でつなげばOKです。 JavaScript var typewrite1 = $.typewrite($('#typewrite1')); $('#d
France
French Riviera - A tour of several villages... mostly small, out of the way places like Villefranche-sur-Mer, Bandol, Cassis, and the well known Monaco and Monte Carlo. Provence - Using a renovated farm house as base camp, we made day trips to Arles, Avignon, Tarascon, Gigondas, Les Baux and more. Collioure - One of the most romantic and quaint sea side villages in France. A must see, if you are
jQueryのDeferredとPromiseで応答性の良いアプリをー基本編 | ゆっくりと…
jQuery 1.6 が既にリリース されていますが、1.5 で追加された Deferred を勉強する意味で、Script Junkie から Creating Responsive Applications Using jQuery Deferred and Promises を翻訳してみましたので、共有したいと思います。著者の Julian Aubourg は、jQuery のコアチーム・メンバーとして、Ajax モジュールの書き換えと Deferred 導入を指揮した方だそうです。 記事の途中、各メソッドの説明部分は、jQuery ドキュメントの翻訳に差し替えていますので、リファレンスとして使ってもらうのも良いかと思います。 Deferred や Promise は、概念や用語が少々分かりにくいところがあるかと思いますので、読んでくださった方の、少しでも理解の助けになれば幸いです
jQuery.Deferredって何
programming notes. mainly about JavaScript / jQuery. [@Takazudo] [takazudo@gmail.com] Hint: alt + / ※ このブログの内容は弊社が運営する有料サービス、CodeGridにてより詳しい内容をご参照いただけます（宣伝） jQuery deferredの使い方 - deferredの基本 | CodeGrid === jQuery1.5から追加された機能。でも全然使ってないので調べた。 jQuery1.5からはdeferredオブジェクトっていうものが登場。 これは、「イケてるキュー（待ち行列）の仕組み～遅延もあるよ～」みたいなものです・・・ 説明がムズイけれどもなんかそんな感じなのです。今までは function fetch(callback){ doAjaxThings('somefile.js
jQueryMobileを使ってのスマートフォンサイトの構築メモ at HouseTect, JavaScriptな情報をあなたに
Captcha security check hisasann.com is for sale Please prove you're not a robot View Price Processing
jQueryのDeferredオブジェクトについて調べてみた - AOEの日記
はじめに 最近になって jQuery に Deferred Object と呼ばれるものが追加されたことを知りました。バージョン1.5から追加になったようです。 ここのところ色々な場面で非同期処理と付き合うことが多かったこともあって調べてみたのですが、中々嬉しい機能を持っているやつであることが判明したので、調べた内容についてまとめてみました。 非同期処理は結構書きにくい jQuery Deferred オブジェクトは非同期処理を書きやすくするために用意されたものです。でも何でそんなものが追加されたのでしょうか？ 非同期処理は複雑になってくると書きにくいものです。Ajaxリクエストを例に挙げてみます。 $.ajax({ url: "serviceA.json", success: function(data) { // リクエストが成功したときの処理 }, error: function(x
画面外からニョキっとスライドしてくるエフェクト at softelメモ
ちょっと注目してほしいアラートや誘導に使えます。 Ajaxで非同期でデータを更新した後、「更新しました！」などの情報を表示したり。 上からでてくるのはiOSの通知センターみたいですね。 jQueryではanimateという動きを指定できる機能が用意されていますのでそれを利用します。 jQuery:animateでスライドエフェクト CSS3が使えるブラウザだとanimateを使わなくても(つまりjQueryいらず)実装できます。 (Firefox,google Chrome,safariで閲覧してください。IEだとアニメーションしません) CSS3でスライドエフェクト jQuery単体ではできない背景色の変化もCSS3では行うことができます。
jQueryのテンプレートプラグイン「jquery-tmpl」を使ってみた (多分)その1 - 黒羊工房はてな版
追記：続編書きました。 リンクは一番下に 最近jQueryにはまっているひつじです。こんにちは。 jQueryに限らず、JavascriptでDOMをいじっていると var name = 'bsheep'; $('<div>').addClass('name').text(name).appendTo('#profile'); // // <div id="profile"></div> // ↓ // <div id="profile"><div class="name">bsheep</div></div> // こんな感じでDOMをその場で生成して埋め込みとかいう操作が結構あります。 でも、こういうの書いているとHTMLとscriptとを分離したくなってきますよね！ この書き方のまま複雑なものとか作ってると、できあがりのHTMLの構造を読み取るための思考コストがかなり必
テキストをタイプライター風に表示するjQueryプラグイン集｜BLACKFLAG
jQueryでWebページ上にテキストを表示する際に、 タイプライター風に一文字一文字入力されるような動きをつけれないか調べていたところ いくつかプラグインが存在していたのでメモ書き程度に紹介してみます。 News ticker (BBC style) | jQuery Plugins ≫News ticker (BBC style) | jQuery Plugins 対象とするIDやCLASSを指定した後、 開始時間のタイミングや細々オプションが設定可能で 使いやすそうなプラグインです。 grab bag ≫grab bag テキスト表示であれこれ動きをつけれるプラグイン。 タイプライター風に表示するには「$(“#my-container”).typewriter();」で 実装可能なもよう。 jQuery TickerType Plugin ≫jQuery TickerType Plu
jQueryプラグインのベストトレンド総まとめ2010*ホームページを作る人のネタ帳
もはやこの業界ではかなり浸透しつつあるjQuery。 今回はそんなjQueryにスポットを当て、本年度紹介された中でも、ホットなトレンドプラグインをご紹介します。 ※プラグインつかってないのもあります。 １）3D表示プラグイン サンプルデモ 今年のトレンドと言えば3D。 というわけでこちら。まずはサンプルデモを確認。 触ってわかる通りですが、2枚の画像が3D表示されます。 呼び出す $(function() { $('#mindscape').smart3d(); }); HTML <ul id="mindscape"> <li><img src=".../mindscape1.png" /></li> <li><img src=".../mindscape2.png" /></li> </ul> CSS #mindscape { width: 720px; height: 170px;
jQueryおよびjQuery Mobile最新版登場 | エンタープライズ | マイコミジャーナル
Delivering top-of-the-line JavaScript and a unified User Interface across the most-used smartphone web browsers. 12日(米国時間)、スマートフォンやタブレットデバイス向けに開発されているJavaScriptフレームワークの最新版となるjQuery Mobile Alpha 2が公開された。大幅なバグ修正、機能拡張、性能改善が実施されたバージョンで、iOS、Androind、Blackberry Torch v.6、Palm WebOS Pre/Pixiなどに対応。品質が向上した注目すべきバージョンに仕上がっている。動作にはjQuery 1.4.4が必要。jQuery Mobile Alpha 2における主な特徴は次のとおり。 jQuery Mobile全体の品質を向上 多くのサ
CSS3とjQueryでフォームを美しく装飾する方法
2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです！そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト！ フォームの仕様 今回チャレンジするフォームの主な仕様です！ グラデーション・ボックスシャドウを使って立体感を表現 角丸で丸みをつける（モダンブラウザ） 対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ？という人もひとつひとつ記述していけば意外と簡単に作れるはずです！リンクをクリックで各項目にジャンプします。 テキストボック
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Blogger