» JavaScript
jQuery初心者もOK、サイトにアニメーション効果を取り入れるチュートリアル
28 days ago
「Super-Easy Animated Effects with jQuery」
jQueryを使用して、サイトにフェードやスライド、表示・非表示、タイマーなどのアニメーション効果を取り入れるチュートリアルを紹介します。
チュートリアルは英語ですが、使用する関数、ソース（HTMLとJavaScript）が必要最小限でまとめられており、デモページ（シンプルすぎかも）もあるため、英語が苦手な人でも大丈夫だと思います。
・アニメーションでフェードイン・フェードアウト
・アニメーションで表示・非表示
・アニメーションでスライドアップ・スライドダウン
・アニメーションで移動
サイトでは他にもアニメーションにディレイやストップを加えたチュートリアルがあります。
» Read More
»情報元へ移動
jQueryを使用して、サイトにフェードやスライド、表示・非表示、タイマーなどのアニメーション効果を取り入れるチュートリアルを紹介します。
チュートリアルは英語ですが、使用する関数、ソース（HTMLとJavaScript）が必要最小限でまとめられており、デモページ（シンプルすぎかも）もあるため、英語が苦手な人でも大丈夫だと思います。
・アニメーションでフェードイン・フェードアウト
・アニメーションで表示・非表示
・アニメーションでスライドアップ・スライドダウン
・アニメーションで移動
サイトでは他にもアニメーションにディレイやストップを加えたチュートリアルがあります。
» Read More
»情報元へ移動
非常にダイナミックかつ印象的にウェブサイトをナビゲートするスクリプト
30 days ago
「jQuery Panel Magic」
画面遷移が非常に印象的な体験に変わるUIが実現出来るJSです。
グリッドあるいはマトリックスに配置したサムネイルを使用して、ダイナミックにウェブサイトをナビゲートするスクリプトを紹介します。
マトリックスに配置された各サムネイルをクリックすると、該当のパネルへアニメーションで遷移します。
» Read More
»情報元へ移動
画面遷移が非常に印象的な体験に変わるUIが実現出来るJSです。
グリッドあるいはマトリックスに配置したサムネイルを使用して、ダイナミックにウェブサイトをナビゲートするスクリプトを紹介します。
マトリックスに配置された各サムネイルをクリックすると、該当のパネルへアニメーションで遷移します。
» Read More
»情報元へ移動
ウェブデザインに使えるチャート・グラフツールいろいろ
30 days ago
企業サイトでは売上の推移や販売シェアなどグラフやチャートなどを使って分かりやすく表示したいといったニーズは結構あります。エクセルで作成したグラフを貼り付けたりするのも可能ですが…。今回は、JavaScriptやFlashなどを使って比較的、簡単にグラフやチャートを生成できるツールをいろいろまとめてみました。
» Read More
»情報元へ移動
» Read More
»情報元へ移動
画像を使ったいろいろなjQueryプラグイン224個まとめ
30 days ago
「200+ collection of jQuery for images」
画像にエフェクトをかけて拡大表示 したり、スライドを作ったり、ツール チップで表示したり、というような 画像を使用したjQuery全般が沢山 あるのと、探してる方が直ぐに見つ けられるようにリンク集を作りました。
という訳で、集まっているjQueryのプラグインの共通点は画像を使っている、という事だけです。一貫性無いといえば無いですが、個人的にも必要とする事が多いので自分用のメモも兼ねてシェア。
さらに日本語と英語記事が切り替えられるようになっていて素敵です。
» Read More
»情報元へ移動
画像にエフェクトをかけて拡大表示 したり、スライドを作ったり、ツール チップで表示したり、というような 画像を使用したjQuery全般が沢山 あるのと、探してる方が直ぐに見つ けられるようにリンク集を作りました。
という訳で、集まっているjQueryのプラグインの共通点は画像を使っている、という事だけです。一貫性無いといえば無いですが、個人的にも必要とする事が多いので自分用のメモも兼ねてシェア。
さらに日本語と英語記事が切り替えられるようになっていて素敵です。
» Read More
»情報元へ移動
ECサイトなどに良さげな360度回転できる画像JSビューワー
30 days ago
「Swivel Viewer」
Swivel ViewerはGoogle/JavaScript製のオープンソース・ソフトウェア。物を買うときには色々な角度から商品を見たいと思うだろう。一方向だからだけ眺めても実感が沸かなかったり、側面から捉えた写真があってもやはり分かりづらかったりする。
その解決策としてGoogleが提案しているのが360度全方向からの写真提供だ。一つのオブジェクトを全方向から写真を撮る必要があるので素材の用意も大変だが、素材さえ用意すればビューワーはSwivel Viewerが利用できる。
JavaScript製のイメージビューワーで、マウスで左右に動かすことができる。マウスを動かすと写真の中の対象オブジェクトが回転する仕組みだ。
さらにズーム機能がある。
» Read More
»情報元へ移動
Swivel ViewerはGoogle/JavaScript製のオープンソース・ソフトウェア。物を買うときには色々な角度から商品を見たいと思うだろう。一方向だからだけ眺めても実感が沸かなかったり、側面から捉えた写真があってもやはり分かりづらかったりする。
その解決策としてGoogleが提案しているのが360度全方向からの写真提供だ。一つのオブジェクトを全方向から写真を撮る必要があるので素材の用意も大変だが、素材さえ用意すればビューワーはSwivel Viewerが利用できる。
JavaScript製のイメージビューワーで、マウスで左右に動かすことができる。マウスを動かすと写真の中の対象オブジェクトが回転する仕組みだ。
さらにズーム機能がある。
» Read More
»情報元へ移動
テーブルのデータをアニメーションでソートするスクリプト
39 days ago
「Animated table sort」
テーブルのデータをアニメーションで分かりやすくソートするスクリプトを紹介します。
デモではヘッダをクリックすると、各データがアニメーションでソートされます。
スクリプトは正規表現をサポートしており、数字やASCII文字を上昇あるいは下降を用いてソートするかどうかをコントロールすることができます。
Animated table sortはjQueryのプラグインのため、実装にはjquery.jsが必要です。
» Read More
»情報元へ移動
テーブルのデータをアニメーションで分かりやすくソートするスクリプトを紹介します。
デモではヘッダをクリックすると、各データがアニメーションでソートされます。
スクリプトは正規表現をサポートしており、数字やASCII文字を上昇あるいは下降を用いてソートするかどうかをコントロールすることができます。
Animated table sortはjQueryのプラグインのため、実装にはjquery.jsが必要です。
» Read More
»情報元へ移動
