普段あまり目にしないようなインパクトのあるサイトを作りたい。そんなときにはいつも見ている日本国内のWebサイトだけでなく、海外サイトに目を向けてみるといいかもしれません。これまでにもこの連載ではいくつかの海外サイトを紹介してきましたが、今回見つけたのはアルゼンチンのWebサイトです。 「Sikker」という名前のサイトは、Webデザイナー・Nicolas Calabreseさんのポートフォリオサイト。1ページのみ、スクロール無しの“1枚絵”のようなごくごく小さなサイトですが、その分、CSSやJavaScriptの小技を効かせて、カッコよく楽しいサイトにデザインされています。今回は、このSikkerをお手本とさせてもらうことにします。 今回のお手本サイト：『Sikker』 アルゼンチンのWebデザイナー、Nicolas Calabreseさんのポートフォリオサイト。グローバルブランドのロゴが

そうか、こんなスクリプトでもいいのかと気づいた時は、驚いたり感動したりするのですが、今回のスクリプトもそんな一つ。リンクのクリック領域を親要素全体に適応する方法なのですが、「そうか、こんな考え方もできるのか！」なんて思ってしまったスクリプトです。 ネタ元：Useful and Handy jQuery Tips and Tricks 今回使うHTML <ul> <li><a href="#">リンク</a></li> <li><a href="#">リンク</a></li> <li><a href="#">リンク</a></li> </ul> 単純にliをCSSでブロックに見せて作ったサンプルです。 同じウィンドウ内に開く ■スクリプト $("div#test1 li").click(function(){ window.location=$(this).find("a").attr("h

はっ！？内容とリード文があってない！？ ってことでいつのまにやら修正しておく。 背景色とか文字色とか、色関係をアニメーションさせようと思っても、 どうやらjQuery単体ではアニメーションできない。 なぜ！？ とまぁ、背景とか色関係をアニメーションで使いたいなと思ったので、 色関係を扱えるようにするプラグインを見つけたので、メモエントリーしておく。 jQueryだけだと背景色と文字色はアニメーションできない jQuery単体だけだと、背景色や文字色のアニメーションができないのです。 理由は下記の通りのようです。 数値型の値をとらない属性（backgroundColorなど）には、animate関数は対応していません。 animate - jQuery 1.2.6 日本語リファレンス つまり、アニメーションさせるには変化させるための数値が必要。 ところが色の値などはデフォルトの状態では数値化