[フロントエンド] ブラウザレンダリングの仕組みを理解して、ブラウザに優しいJavaScriptを書こう - YoheiM .NET
[フロントエンド] ブラウザレンダリングの仕組みを理解して、ブラウザに優しいJavaScriptを書こう こんにちは、@yoheiMuneです。 ブラウザのレンダリングの仕組みはHTML5 RocksやHow browsers workで詳しく解説されてきました。しかしそれらはとても詳細で、読破して理解するのは大変です。 今回のブログでは手軽にレンダリングの概要を理解できるように心がけました。またより詳しく学べるようなリンクも記載しました。 そしてブラウザのレンダリングの仕組みを理解した上で、どのようなJavaScriptを書くべきかについても記載しました。 目次 ブラウザのレンダリングの仕組み この章では、HTMLとCSSが読み込まれてから画面に表示されるまでの間に、ブラウザがどのような処理を行っているかを説明します。 ファイル読み込みから表示までの一連の流れは以下図の通りです。 [1]
![[フロントエンド] ブラウザレンダリングの仕組みを理解して、ブラウザに優しいJavaScriptを書こう - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/705cdef7654f2f96a242f9a2834ce643b78de75c/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F336.jpg)
無限に回転するカルーセルＵＩ実現用jQueryプラグイン実装チュートリアル:phpspot開発日誌
jQuery Infinite Carousel | jQuery for Designers - Tutorials and screencasts 無限に回転するカルーセルＵＩ実現用jQueryプラグイン実装チュートリアル 次のような、最後のアイテムに移動しても、最初に戻る無限に回転するカルーセルを作成していくチュートリアルが公開されています。 スクリーンキャストで、作成の過程についても紹介されていて、分かりやすい。 単純に誰かの開発環境を覗くという意味でも勉強になりそう。 更に、図入りで、仕組み・コードについて紹介する形のチュートリアルになっています。 関連エントリ ナビゲーションメニューを1歩進んだものに引き上げるjQueryチュートリアル集 jQueryやPHPを使った便利な仕組みのチュートリアル集 jQueryクライアントとPHPサーバ間をJSONで結ぶチュートリアル
その場で検索して結果に素早くアクセスする·jQuery Live Search MOONGIFT
インターネットの世界では素早さを求める動きが強まっている。それこそ、サイト内検索で欲しい情報が見つからなかったり、レスポンスが遅れたりすればあっという間にユーザがいなくなってしまう。 JavaScriptだけで検索を行う そんな高速なサーバ検索は難しいかもしれないが、クライアントサイドであれば意外と高速化できる。 今回紹介するオープンソース・ソフトウェアはjQuery Live Search、jQueryを使ったリスト検索ライブラリだ。 jQuery Live SearchはWebページ上にあるリストを検索するライブラリだ。リアルタイムにフィルタリングが行われるのでインクリメンタル検索に近い。デモでは1,000件のリストに対してフィルタリングを行っている。 文字を入力するたびに絞り込まれていく レスポンスはブラウザの性能によるだろうが、思っていた以上に高速だ。検索結果の件数も表示されるので
アイコン付きタブが可愛いアニメーションメニューを実装するチュートリアル:phpspot開発日誌
jQuery Tabbed Interface / Tabbed Structure Menu Tutorial | Queness アイコン付きタブが可愛いアニメーションメニューを実装するチュートリアル。 次のような美しいUIと共に、クリックするとアニメーションしながらメニューが切り替わるナビゲーションの作成チュートリアル。 デモページ HTML,CSSの構成についても分かりやすく解説されています。 JavaScriptはjQueryを使って実装されているみたいです。 サイトのサイドメニューとして置くと、スペースが有効活用できるだけでなく、オシャレ感を出すことができそうです。 関連エントリ 滑らかにアニメーション動作してナビゲーションにも使えそうな1KBのアコーディオンＵＩ ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集 デザインの参考になるユニークなナビゲーション集 j
デザイナー・コーダー必見！使えるform関連jQueryプラグインの数々 | バシャログ。
こんばんは、最近ホルモン焼きにハマっているishidaです。 WEBサイト制作時、formは必ずといってもいいぐらい存在します。 お問い合わせフォームや会員登録フォームなどがすぐに思いつきますよね。 デザインをがっつりフォーム部分で作り込んでも、CSSのみでは、 実現できなかったりすることもよくあります。 そんなクセのあるformを、よりリッチに！かつ操作性を向上！できるjQueryプラグインの数々をご紹介します。 デザイナーの方は、フォームのデザインの参考に。 コーダーの方は、ページ作成時間の短縮に手助けになればと思います。 jQuery plugin: Validation フォームの入力チェック（バリデーション）が簡単にできるプラグイン。 エラーメッセージはlocalizationディレクトリ内に18言語用意されています。 日本語用は別途作成し、使用することが可能です。 jQuery
jQuery版のLightBox「ThickBox」
jQuery版のLightBox「ThickBox」 ThickBoxはLightBoxのjQuery版とも言えるJavaScriptライブラリで、画像をクリックするこのにより拡大画像を表示させることが可能です。 LightBoxがprototype.jsをベースに開発されたjsライブラリであるのに対して、ThickBoxはjQueryをベースに開発されています。 設置方法 配布ページよりjquery.jsとloadingAnimation.gif、thickbox.css、thickbox.jsというファイルをダウンロードし、ThickBoxを利用したいhtmlのhead要素などでそれらのファイルを読み込みます。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Site Under Maintenance