画像を使わず、CSS+jQueryで絵文字を作れる・JQuery CSS Emoticonsがちょっと素敵だｗ
これはちょっと面白いｗ画像を使わず、cssとjQueryだけで顔文字を作ってしまったみたいです。発想が単純だったのでうまく応用出来れば楽しいものが出来あがりそうな予感もしますな。面白い事考える人がいますね・・ｗ CSS+jQuery（と、もちろんHTML）のみで、画像は一切使われていません。ちょっとこの発想なかったです。ユニークですけど、割と使い勝手がいい気がする・・気のせいかなｗ 一見よく見かけるアイコンだと思うんですけど、これ、全部cssとテキストとjsで作られています。 からくり こういう発想。単純だけど思いつきませんでしたｗなので、以下のようにテキストとして選択できます。 :Ｄとか:ｐを縦にして、グラデーションのかかった黄色い枠を作れば完成ですね。 コード<link href="stylesheets/jquery.cssemoticons.css" media="screen"
HTML5やCSS、jQueryなど、Web制作に関する日本語スライドを集約したSlideFinderが便利っぽい - かちびと.net
結構便利だったのでシェア。Web制作 に関する日本語スライドを集約している フォロワーさん作のWebサービスです。 話題のHTML5やCSS、iPhoneの事や jQueryからPHPやRubyと幅広くサポート してあります。 人気のスライド共有サイト、SlideShareで日本語のスライドのみを集めています。スライドはその場でLightbox風にポップアップして見れます。英語が苦手な方も探す手間が省けるのでは。 @deeekiさん作のWebサービスです。クックパッドのエンジニア向け「第2回 開発コンテスト24」に応募する予定だったようで、数時間で作成されたみたいで見た目はシンプルですね。 カテゴリもHTML5やjQuery、PHPやiPhone、WordPressなど多岐にわたりサポートされていますので全Web屋さん向けと言えそうです。 日本語のスライドのみを集約 集められたスライドは全
Design Trends for Fixed Navigation Menus in Web Design - Designmodo
With Postcards Email Builder you can create and edit email templates online without any coding skills! Includes more than 100 components to help you create custom emails templates faster than ever before. Free Email BuilderFree Email Templates It doesn’t shrink by much but you can tell there is a difference when scrolling. This is the type of thing I look for in very large navigation menus. I also
960グリッドシステムをjQuery-Mobileと併用する為のスタイルシート・jquery-mobile-960
どこかで使うかもしれないと思って メモがてらシェア。スマートフォンに サクッと対応させるjQueryプラグイン のjquery-mobileに960グリッドシス テムを取り入れることが出来るcss、 jquery-mobile-960です。 なんだかタイトルが謎ですが語彙が無いだけなので気にしないでください。jquery-mobile-960はライセンスがMIT。商用もOKで無料で配布してくれています。 jquery-mobile-960は、960.gsをjQuery-Mobileを使ったレイアウトにも使うためのcssです。2カラム、3カラム、イメージギャラリーなどに使えそうな4カラムレイアウトなどもも思いのまま。 少し大きいですけど全画面キャプチャ↓ 実際にiPhoneで確認 縦の場合。 横の場合。 使い方<link href="http://code.jquery.com/mobile
[JS]フォームの入力欄を次々にアニメーションで表示するスクリプト
フォームの項目を入力すると、次の入力欄がアニメーションで表示されるコンテンツを実装するチュートリアルを紹介します。 Gravity Registration Form with Jquery デモページ [ad#ad-2] フォームの出来ぐあいは、ウェブアプリケーションとしての成功率を左右する要因となります。 一つのアプローチとして、ユーザーに入力欄の数を少なく感じられるように、入力する項目を一つずつ表示するスクリプトを紹介します。 フォームの実装 フォームの各項目は、リスト要素で実装しています。 HTML <form method="post" > <ul> <li class="email"><label>Email: </label><br/> <input type="text" username="email" id="email" AUTOCOMPLETE=OFF/><span
ウェブデザイナーのための実用的なデザインとコーディングテクニック集
Five Useful Design Techniques and Coding Solutions For Web Designers [ad#ad-2] 下記は各ポイントを意訳したものです。 PHPはWordPressでのものとなっています。 1. 複数の項目がある棒グラフのエフェクト 2. ホバー時に追加情報を表示 3. カテゴリごとに異なるカラーを適用 4. ちょっと面白い画像のキャプション 5. ウェブのための印刷風デザイン おわりに -developersではなく、designers 1. 複数の項目がある棒グラフのエフェクト 下記のサイトで使用している棒グラフでは、上：タグの種類と数、下：コメントのついた記事と数、をそれぞれ素晴らしいエフェクトで実装しています。 こういった数値化されたデータは、ユーザーに対して有用なコンテンツの手がかりを提供し、ユーザビリティを改善することに
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://designaholic.cc/2011/03/jquerycss20.html
HTML5, CSS3, jQuery1.4, WordPress3の厳選チートシート集
フォームのテキストエリアをより使いやすくするテクニック集