jParallaxは、複数のパネルをパララックスで奥行きを表現し、マウスの動きに合わせてダイナミックにスクロールさせるスクリプトです。 jParallax 複数のイラストを重ねただけでも面白いですが、下記のデモのように写真画像を使用したものや、単に大きい画像のビューアーとしても面白いものとなっています。
jParallaxは、複数のパネルをパララックスで奥行きを表現し、マウスの動きに合わせてダイナミックにスクロールさせるスクリプトです。 jParallax 複数のイラストを重ねただけでも面白いですが、下記のデモのように写真画像を使用したものや、単に大きい画像のビューアーとしても面白いものとなっています。
「こんな長いWebページ、まったく読む気がしない」。Webサイトを閲覧していてこんな経験をしたことは誰しもあるのではないだろうか。一方で、Webサイトを作る側にとっては、どこまでを1ページにまとめるかは常に悩むところだと思う。長いからといってむやみにページが分割されているのも考えもので、今度は「次のページへ」ボタンをクリックするのが面倒になり、ストレスがたまる。 CogniTom Academic Designが作った「bookreader.js」は、そんな悩みを解決してくれるかもしれない。bookreaderは、本や雑誌をめくるような感覚で、Webページの本文を横にスクロールさせるJavaScriptライブラリだ。 「bookreader.js」のWebサイト。サイト自体がbookreader.jsを使ったデモサイトを兼ねている。中央にある [<] [>] をクリックすると1ページずつ、
bookreader.jsは、長文を縦スクロールではなく、横スクロールで表示し読みやすくするJavaScriptライブラリです。 →プロジェクトのホーム (Google Code) - New!! →ダウンロード(ver 0.4.6) - 2009/04/18公開 ※ダウンロードの詳細については、こちらのページをご覧下さい。 まずは、このページで体験してみて下さい。キーボードの[→]/[←]キーが、「進む」あるいは「戻る」に対応します。画面上に表示される、半透明の▶/◀ボタンをクリックしてもOKです。使い方の詳細は「ヘルプ」を参照ください。 次期バージョンの開発状況 幸いにしてさまざまな方からフィードバックをいただきました。ありがとうございます。それを元に機能の絞り込みとWEBサイトへの「組込み方」について検討を行っています。まだ、実装の方針が定まった、という段階ですが次期0.8.x系のサ
先日、ネタ元へのリンクを分かりづらいところに貼ってしまい、人気ブロガーの方に怒られてしまいました。。。以後気をつけます。 さて、気を取り直して今日はAJAXの普及などで益々多用されるようになった「タブメニュー」を作る際に気をつけるべき、ユーザビリティのガイドラインをご紹介したいと思います。 組織のマインドマップツールをマインドマイスターにすべき理由 伸びてる産業、会社、事業を紹介しまくるStrainerのニュースレターに登録!! タブユーザビリティ、13のガイドライン Ajaxタブは、違うコンテンツを表示するにもかかわらず、ページを先に読み込むため、ページが切り替わるストレスが少ないことから、さまざまなサイトに導入されています。 1. タブは同じ文脈内で一覧を作る代わりに使おう 異なるエリアへのナビゲーションに使ってはいけません。言われてみればなるほどと感じます。amazon.comは、過
操作感はAJAXで、画像などはCSSで実装されたわかりやすいプログレスバーです。進捗状況などの表示が簡単にできます。また、クリックする度に10%増やしたり、あるいは減らしたりといったことも可能。いろいろなウェブアプリの開発などに応用できそうです。 詳細は以下から。 WebAppers Simple Ajax Progress Bar with CSS by WebAppers ライセンスはMITライセンスで提供されており、以下から実際に試してみることができます。 Demo http://www.webappers.com/progressBar/ 実際にダウンロードしてみると、prototype.jsを使っており、使用するイメージ画像は2種類。その組み合わせでバーの増減を表現するとは、なかなかいい発想。
今回まとめた内容をあらかじめ言っておきます。 CSS JavaScript イメージギャラリー Generator Ajax です。 とりわけJavaScriptやCSSは色々なブログでも使える為、ブロガーも頑張れば導入可能なプログラム等をなるべく多めにまとめました。 これは『個人的な感想』のテーマで、私個人が遊び心をくすぐられたものをまとめています。 あくまで私がくすぐられたもので、他の人がくすぐられるかどうかまでは保障できませんので、上記キーワードに興味の無い方は特にあらかじめご了承ください。 送信ボタンなどをちょっとセクシーにするCSS 送信ボタンなどをちょっとクールにかわいらしくする為の知識。 JavaScriptがいらないイメージマップの切り出しサンプル 画像にマップを埋め込んで華麗に表示する為の知識。 口で言うより、デモを見たほうが早い。 チェックボックスとラジオボタンをオシャ
This shop will be powered by Are you the store owner? Log in here
auのトップページのような、伸縮してスライドするメニューをjavascript+cssで作れるみたいです。「Image Menu」というライブラリで、動かすにはmootools.jsが必要のよう。 <script type="text/javascript" xsrc="imagemenu.js" mce_src="imagemenu.js" ></script> <div id="kwick"> <ul class="kwicks"> <li><a class="kwick opt1" xhref="" mce_href="" ><span>TOP</span></a></li> <li><a class="kwick opt2" xhref="" mce_href="" ><span>CSS</span></a></li> <li><a class="kwick opt3" xhref
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く