[CSS]モーダルウインドウをシンプルな操作とアニメーションでどれだけかっこよく表示できるかのデモ
トリガーはシンプルなクリック操作、そしてシンプルなアニメーションを使って、モーダルウインドウをいかにかっこよく表示するかのデモンストレーションを紹介します。 NIFTY MODAL WINDOW EFFECTS デモはCSS3アニメーションを使用しているので、Chrome, Safari, Firefox, Operaなどのモダンブラウザでご覧ください。 モーダルウインドウのエフェクト19種類 アニメーションgifにして紹介しようと思ったけど、ちょっと重すぎるので断念。 どれもかっこいいのですが、オススメは下記でしょうか。 Fade in & Scale フェードで拡大しながら表示 Fall 縮小しながら集まるように表示 Sticky Up 上から張り付くように表示 3D Flip(Horizontal) 水平にくるっと回転して表示 Just Me 全画面に表示 Slit 真ん中に筋をいれ
[JS]シンプルで軽量だけど、充分な機能を備えたコンテンツスライダーのスクリプト -Casual Slider
Casual Slider [ad#ad-2] Casual Sliderの特徴 Casual Sliderのデモ Casual Sliderの使い方 Casual Sliderの特徴 Casual Sliderは実装が簡単で、シンプルながら充分な機能を備えたコンテンツスライダーです。 4KBと超軽量のスライダー タイマー機能付き あらゆるHTMLエレメントを配置可能 全てのメジャーブラウザをサポート カスタム ナビゲーション セットアップが簡単 アニメーションの種類は多数 デフォルトのテーマも用意 Casual Sliderのデモ デモもシンプルですが、Casual Sliderの使い勝手が分かると思います。 各パネルに半透明のキャプションも表示できます。 Casual Sliderの使い方 HTML 各パネルはリスト要素で実装します。 <div id="slider"> <div cl
[CSS]シンプルながらバリエーションが豊富なソーシャルメディアのボタン
デモページ：カスタム CSS Social Buttonsの使い方 このソーシャルメディアのボタンはピュアCSS3でもHTML5 Canvasでもなく、背景画像を使って実装するものです。これらのアイコンはクロスブラウザで、さまざまなデザインに利用できるよう広い用途を目的としたものです。 外部ファイル スタイルシートを外部ファイルとして記述し、画像フォルダをスタイルシートを同じ階層に設置します。 <link href="social-buttons.css" rel="stylesheet"> HTML テキストをa要素で内包し、classにボタンのスタイルを定義します。 「sb」を共通で、あとはスタイルを組み合わせて記述します。 <a href="#" class="sb orange twitter">Twitter</a> <a href="#" class="sb blue face
使い勝手がよい、50種類のシンプルなデザインのアローのベクター素材
アロー素材全50種類のキャプチャ ダウンロードできる素材のフォーマットは4つです。 ai: Illustrator用のファイル eps svg csh: Photoshop用のカスタムシェイプ [ad#ad-2] Photoshop用のカスタムシェイプは下記のようになっています。 カスタムシェイプなので、簡単に拡大縮小して利用できます。 アローのカスタムシェイプ50種類 素材の利用にあたっては個人でも商用でも無料とのことです。 詳しくはダウンロードファイルの「MediaLoot_License_Agreement.pdf」をご覧ください。 また、アロー素材は「Vol 1」とあるように、「Vol 2」もあります。 こちらは、サイトにメンバー登録（有償）する必要があります。
すぐに利用できる、5種類のシンプルながら美しいパターンのテクスチャ素材
パターンのデモページ：ノートの罫線 パターン素材の利用にあたっては個人でも商用でも無料、とのことです。 詳しくはダウンロードファイルの「readme」をご覧ください。
商用フリーなシンプルだけど汎用につかえそうな１０６個のアイコンセット:phpspot開発日誌
Pixicus Icon Set: 106 Pixel Perfect Icons | Premium Pixels 商用フリーなシンプルだけど汎用につかえそうな１０６個のアイコンセットが公開されています。 次のようなアイコンセットで、なんか可愛い感じを演出することができそうですね。スマホアプリなんかにも使えそう アイコンはPNG形式で配布されています。 関連エントリ ピクトグラムが７００種類以上集まったアイコンセット「Pictodeck Icon Set」 秀逸なiOSアイコンデザイン４５ TwitterやFacebook等、フリーで使えるソーシャルメディアアイコンセット４０ CSS3のブラウザ別対応がアイコンで超分かりやすいサイト 味のある２８０個の手書きアイコンセット
60の使える＆エレガントなウェブデザイン:phpspot開発日誌
Inspiration Package: 60 Usable & Elegant Designs We all love beautiful, usable and impressive web designs. 60の使える＆エレガントなウェブデザイン。SmashingMagazineより。 31Three North x East Youtilize.com Oaktree Creative CodeIgniter WebRevolutionary Pop Labs nPanorama.ru 続きを見る 最近のウェブデザインはやはり、「Web2.0風」がトレンドのようですね。 読みやすく、シンプルにまとまっていてどのサイトも参考になりそうなサイトばかりです。 関連エントリ WEBデザインの際に使える５０のソース 2007年3月、クリーンかつ印象的なデザインサイト集 PhotoShopで
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
新着記事
新着記事
商用利用も無料、今時のシンプルながらディテールにこだわったUIエレメントとアイコンのPSD素材 -Impressionist UI
新着記事