DesignWalkerのタネ

先日、デザインウォーカーでご紹介した『jQueryサンプル集』

Noupeさんで、またまた、かなりたくさんのjQueryのチュートリアルをまとめられておりました。

51+ Best of jQuery Tutorials and Examples

詳細はこちらからどうぞ〜。
『51+ Best of jQuery Tutorials and Examples』

Popularity: 49% [?]

プログレスバーは、タスクの進行状況がわかって、とっても便利ですよね。

Pure CSS Animated Progress Bar

この、プログレスバーは、CSSとGIFアニメーションだけでとっても簡単に作れてしまいます。

用意する画像は、以下の３種類です。

1. 枠の画像

2. バーのGIFアニメーション

3. バーを隠す画像（分かりやすくするために、横幅を広げて表示してます。）

3のバーを隠す画像をCSSで調節すると、簡単なプログレスバーの出来上がりです〜。

詳細はこちらからどうぞ。htmlファイルもダウンロードできるので、是非お試しください。
『Pure CSS Animated Progress Bar』

Popularity: 34% [?]

こちらのサイトで、↓以下のように、ページの右隅がぺろっとめくれたような効果が出せるスクリプトを公開されていました。

『Create A Peel Away Effect On Website』

右端に、小さくめくれている部分が表示され、マウスがオーバーすると、ぺろっとめくれた感じをが出せます。

Wordpressをお使いの方は、『Pageear – free peel away ad』、こちらのプラグインを入れると、簡単にめくれた感じが出せるようですよ。

Popularity: 36% [?]

オープンソースのJavaScriptツール『iCarousel』を使うと、簡単に、画像のスクローラーなどが作れます。

iCarousel

例えば、↓こんなやつとか、

↓こんなやつとか

ぜひお試しください。
詳細はこちらからどうぞ〜。

『iCarousel』

Popularity: 15% [?]

Vandelay Website Designさんのエントリで『25 Beautifully Dark Website Designs』がアップされておりました。

ダークで綺麗なウェブサイトが25サイトご紹介されております。

その中から、いくつかピックアップしてご紹介。

1. Colour Managed Large Format Printing Service

2. Blog ~ Ten Thousand Things

3. smashLAB – Strategic interactive agency

4. mojave (vancouver band) acoustic rock

まだまだ、たくさんございます。続きはこちらからどうぞ～。
『25 Beautifully Dark Website Designs』

Popularity: 17% [?]

以前、デザインウォーカーでご紹介した『Lightboxスクリプトいろいろ』

Shadowbox.jsもなかなかいい感じです。

Shadowbox.js

画像はもちろん、SWFやムービーファイル、などもポップアップさせることができます。

また、大きな画像をポップアップさせて、Lightbox上でドラッグさせることができたり、イメージマップ機能を使えば、画像の一部をポップアップさせて見せることもできます。

詳細はこちらからどうぞ～。
『Shadowbox.js』

Popularity: 18% [?]

テキストボックスに、テキストを入力して（残念ながら、日本語には対応していませんが）、お好みのスタイルを選んで、『Create』ボタンをクリックするだけで、ロゴを生成してくれるツールです。

Free Logo Generator

簡単に綺麗なロゴを作ってくれて、とっても便利ですね。

詳細はこちらからどうぞ～。
『Free Logo Generator』

Popularity: 24% [?]

MTで作られた綺麗なサイトを集めたショーケースサイト

Movable Love

MTを使われている方には、いろいろと参考になるのではないでしょうか？

とっても綺麗なブログがたくさん集められていますよ～。

詳細はこちらからどうぞ～。
『Movable Love』

Popularity: 15% [?]

先日、『Movable Type Design Assistant』なるものが公開されましたね。

MovableTypeを使っていて、デザインを変えたいけどHTMLやCSSの知識があまりない方にはお勧めです。

Movable Type Design Assistant

1. ページ上部に表示されているStyleからお好みのスタイルを選びます。スタイルをクリックすると、ページ下部にそのスタイルが適用されて、のサンプルが表示されます。

2. レイアウトを選びます。3カラム、2カラムお好みのレイアウトを選んでください。

3. CSSをカスタマイズできます。変更したい部分をクリックするとページ右上に設定されている、CSSが表示されるので、そのCSSを変更して、”Apply CSS”をクリックすると、設定できます。

MovableTypeにログインして、スタイルを変更すれば出来上がりです！

詳細はこちらからどうぞ～
『Movable Type Design Assistant』

Popularity: 14% [?]

ホットな女性有名人を集めたWikipediaみたいなサイト『Chickipedia – The Wiki of Hot Women』

このサイトの検索サジェストがちょっといい感じです。

Chickipedia – The Wiki of Hot Women

試しに『a』とタイプしてみると・・・

『A』から始まる女性有名人が画像付でサジェストされます。

ちょっとした違いですが、画像があるとわかりやすくていいですよね。

『Chickipedia – The Wiki of Hot Women』

Popularity: 13% [?]