サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
大谷翔平
webdesignkeys.blog61.fc2.com
以下のサイトを見てみてください。 トップの画像にマウスを被せ左右に動かすと、自分が移動して、中を覗き込んでいるような感覚になります。 「Pure CSS 3D Meninas」 実は、このデモでは、HTMLとCSSのみで構成されています。以下のページのソースコードを見るとjsなどのスクリプトを読んでいないことがわかります。またブラウザのjavascriptを無効にしても確かめられると思います。 「Pure CSS 3D Meninas」 では、実際には、どのようにして作っているのか 利用している画像は、以下の3点だけです。 ■パララックス素材① ■パララックス素材② ■パララックス素材③ 覗き込んでいるような印象を与えるためには、背景画像の幅の引き延ばしに よって表現します。これをCSSの疑似クラス[hover]によって少しずつ ずらしています。 人物などは、引き延ばしされないように素材③
アカウント登録などは、基本的に必要なく、フリーで簡単に利用することができます。 1.Bead Art 以下の元画像をこの「Bead Art」で変換すると変換後のように かなりイメージが変わります。 色を一つのドット単位になるので、鮮明さはなくなりますが、 場合によっては格好よく見せられそうなインパクトのあるエフェクトです。 以下のパターンはDiscsの例ですが、他には 「Circle」「Squares」「Blocks」などがあります ■元画像 ■変換後 2.FX モノクロやスケッチ、絵画など、他にも色んなエフェクトを加えることが 可能です。オプションとしてコントラストや強調などがあります。 ■未処理 ■sketch ■painting ■radial blur ■edges ■negative 3.Wallpaper 好きなサイズの壁紙に、カレンダーをつけることができる。 下図のように右下
今回は、私が日頃から利用しているフリーのカラーピックソフトを紹介したいと思います。 FE - Color Palette Webページのデザイン・プログラム開発等において、イメージ通りの色を容易に得ることができる FE-color Paletteでは、画面上の色をカーソルの位置からリアルタイムに確認できるようになっている。 また、色の指定は、HSV形式、RGB形式での色指定が可能であり、作成したパレットは自由に保存することができる。 インターフェイスは以下のようになっており、とてもシンプルで見やすく、動作が軽い。 画面上の色を取得する時は、画面の色というボタンを押す。すると以下のようなズーム画像が出現する この機能のおかげで、ピクセル単位での色の取得がスムーズに行える。 すぽいと君 色名まで分かってしまうスタイリッシュなカラーピッカー ソフトを起動したと同時に、色名やRGBなどを表示するボ
8月24日にapacheのメーリングリストでApache 1.3及び2.x系のバージョンに脆弱性があることが公開されました。それは,HTTPのget,headメソッドでrangeフィールドの指定を分割してリクエストすることで,メモリを大量に消費させることができるというものです。大変危険そうだったので色々調べてみました。 Read more commnet 3 IE9では、HTML5やCSS3などWEB標準化に加えて、GPUレンダリングのよる描画処理が向上しました。MIX11で紹介されたSVG女子は、SVG(Scalable Vector Graphics)のみを使って描画されたアニメーションです。IE9が、WEB標準化へ進化したことが伺えます。 Read more commnet 0
利用はトップから手持ちの画像をアップロードして行う。 サイト中央のupload image to trance と書かれたボタンを押し、画像の選択画面で対象を選択すると 以下の図のような画面に遷移します。 画像は以下3種類の画像ように high medium low の3段階のレベルを選択することが可能となっている。 ■ High ■ Medium ■Low 作成した画像を保存する場合には、エディット画面右上に表示されているDownload Resultと 書かれているボタンを押しましょう。 すると以下のような画面に遷移して、アカウントの作成を要求されます。勿論これはフリーですので、 手持ちのフリーアドレスを入力して次に進んでください。 するとすぐにメールが届くと思いますので、verification codeと書かれた場所の文字列をコピーして 入力してください。(パスワードも表示されてい
>>参考記事 25種類のjqueryプラグインを紹介します。 中にはとてもユニークなものや実用的なものまであります。 デモが見つからないものがありましたが、どのサイトでも ソースはダウンロードできるようになっているみたいです。 01 A fancy Apple.com-style search suggestion テキストを入力すると、アニメーションで関連したトピックスを呼び出します。 デモ 02 Submit A Form Without Page Refresh using jQuery refreshを行わず認証を行うことができます。 デモ 03 jQuery Tools Scrollable アニメーションを利用した横スクロールギャラリー 04 Navigation List Menu with Nudging Effect テキストをマウスで覆った時にアニメーションが動作す
かなりクールなプラグインなので、このサイトでも導入してみました。 参考サイト 参考サイトデモ STEP1 jqueryのダウンロード、導入 以下のサイトからjqueryの最新版をダウンロードして下さい。 http://jquery.com/ ダウンロードしたものをサーバーにアップロードして、<head>タグ内に以下のように記述して下さい。 <script type="text/javascript" src="ファイルのURL" ></script> また以下のようにAJAX Libraries APIのajaxライブラリからjqueryを読み込むことも可能なので、 自分のサーバーにアップロードしなくてもいいやっていう人は以下のように記述しても結構です。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/
このページを最初にブックマークしてみませんか?
『webdesignkeys』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く