iiynのブックマーク / 2010年12月28日

iiyn id:iiyn

2010年12月28日のブックマーク (4件)

jQueryだけで作る、サムネイル画像を魅力的に見せる方法 (1/5)
普段あまり目にしないようなインパクトのあるサイトを作りたい。そんなときにはいつも見ている日本国内のWebサイトだけでなく、海外サイトに目を向けてみるといいかもしれません。これまでにもこの連載ではいくつかの海外サイトを紹介してきましたが、今回見つけたのはアルゼンチンのWebサイトです。「Sikker」という名前のサイトは、Webデザイナー・Nicolas Calabreseさんのポートフォリオサイト。1ページのみ、スクロール無しの“1枚絵”のようなごくごく小さなサイトですが、その分、CSSやJavaScriptの小技を効かせて、カッコよく楽しいサイトにデザインされています。今回は、このSikkerをお手本とさせてもらうことにします。今回のお手本サイト：『Sikker』アルゼンチンのWebデザイナー、Nicolas Calabreseさんのポートフォリオサイト。グローバルブランドのロゴが
iiyn 2010/12/28
jQuery
リンク
jQuery.iColor - jQueryPlugin DEMO
backgroundColor: { 'h': '+=1080', 's': '-=0.3', 'mode': 'HSV' } // ※alpha値はIEでは動作しません backgroundColor: 'rgba(255,255,0,0)', borderTopColor: 'lightblue', borderBottomColor: 'lightblue', borderLeftColor: 'lightblue', borderRightColor: 'lightblue'
iiyn 2010/12/28
色を徐々に変更する、animateの拡張

jQuery
リンク
jQuery：リンクのクリック領域をブロック全体にする簡単なスクリプト
そうか、こんなスクリプトでもいいのかと気づいた時は、驚いたり感動したりするのですが、今回のスクリプトもそんな一つ。リンクのクリック領域を親要素全体に適応する方法なのですが、「そうか、こんな考え方もできるのか！」なんて思ってしまったスクリプトです。ネタ元：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
iiyn 2010/12/28
jQuery
リンク
Zen-Codingのショートカットをまとめてみました - EC studio デザインブログ
前回の記事ではZen-Codingの導入方法について解説しました。今回はZen-Codingの機能とそれを実行するためのショートカットの解説をします。 ※2010/02/22現在の最新バージョン「Zen Coding for Aptana v0.6.0.1」を対象にしています。なおAptana（Eclipse）の場合だとAptanaの方の機能に多くのショートカットが割り当てられているので、利用する環境によってはショートカットを変更する必要があります。Zen-Codingのデフォルトのショートカットが機能しない場合は、記事最後にまとめる変更方法を参考にしてください。 Expand Abbreviation（省略コードの展開） Win：Ctrl+E mac：Command+E Zen-Codingの主な機能のひとつです。
iiyn 2010/12/28
zen
リンク
- 2012年8月27日
- 2010年12月28日
- 2010年12月27日