シングルページで魅せる、縦方向にパララックス効果を表現するjqueryサンプル | バニデザノート
１ページで魅せるポートフォリオサイト風の動きのなかで 最近よく見かけるパララックス効果を採用したデザイン。 今回は縦にスクロールする際に、 スクロールの速度をレイヤーごとに調整して 視覚的に速い部分と遅い部分が起こるようなチュートリアルがありましたので 紹介いたします。 ▼One page website, vertical parallax http://www.webdesignshock.com/one-page-website/ このチュートリアルは、nike better worldというNikeのサイトから インスピレーションを受けて作成されています。 なので、こちらも見ておくことをおすすめいたします。 デモはこちらから。 大事なのは初期のBOXの定義（ＣＳＳ）と それぞれのＢＯＸがどんな動きをするのか （今回だったら特にスクロールスピード）を確認しておくこと。 いまブラウザの
色と人の感覚とウェブデザインのはなし | バニデザノート
前回は空白のお話をしましたが、 今回は色のお話です。 空白・ホワイトスペースの扱いと、色の扱いはとてもよく似ています。 また、ホワイトスペースだけでなく、色も一緒にコーディネートすることで よりわかりやすくウェブデザインを行うことができるようになります。 空白・ホワイトスペースよりも、人間の「目」と、「モニタ」というスペックに関わる部分ですので あくまでも筆者の考え方として参考にしていただけると嬉しいです。 あったかく感じる色 色覚といって、色には人に与える印象があります。 これは、誰もがそう感じるというものではないのですが、 （それこそ、育った環境から、目のスペック、その人の精神的な部分に至るまでゆらぎがあり・・） 「ほぼ多くのひとが感じる」というレベルで、感じ方をある程度グループ分けすることができます。 たとえば、このグループは「暖かい」「活動的」「元気」なイメージがあります。 もうす
最近よくみる定番の動きは、だいたいこれで対応できるjqueryライブラリ | バニデザノート
ウェブデザインのなかで、 jqueryをつかった、さりげない「動き」をウェブサイト上で導入するのが 定番になりつつありますね。 ふわっと、ポップアップみたいに浮き上がってくるウインドウ、 画像やテキストのスライドなど 最近良く見るjqueryでつくる「動き」で、おすすめのライブラリをまとめてみます。 要素をスライドさせるならJquery.cycle.plugin 画像や、テキストなど、 非常にシンプルなhtmlソースを認識して対応してくれるプラグイン。 上から落ちてきたり、横にスライドしたり、フェードイン・フェードアウトしたり スライド番号をつけたり、スライド領域の要素の右左に矢印をつけたりもできます。 シンプルなdemo Even More Demosもオススメです。 オプション一覧はこちら → jquery.cycle.plugin ページ内ポップアップ、lightbox風表現ならfa
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
