タグ

layoutに関するtomo_pのブックマーク (4)

  • Masonry

    What is Masonry? Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. Install Download CDN Package managers Getting started HTML CSS Initialize with jQuery Initialize with Vanilla JavaScript Initialize in HTML Next MIT Lice

  • Responsive Web Design Patterns | This Is Responsive

    Responsive Patterns A collection of patterns and modules for responsive designs. Submit a pattern

  • 【白銀比・計算ツール・2カラム対応】 - 白銀比計算ツール

    重要なお知らせ:このページのツールは、Flashの技術を用いて表示させていたため、現在は動かすことができません。申し訳ございませんが、ご了承下さい。 自然界でもっとも美しいのが「黄金比」なら、人工物や建造物で安定した美しさを持ち、日人にも古来から浸透しているのが「白銀比」。 白銀比は、用紙サイズ(A3やA4など)や建物などに採用されている比「1:√2」のことで、近似値は1:1.4142、約5:7です。日建築には古くから白銀比が用いられ、法隆寺の五重塔を上から見た投影平面図における辺(短辺と長辺)の関係も白銀比になっています。白銀比は別名「大和比」と呼ばれるくらい日に浸透しています。「絞り値、シャッター速度、被写界深度の関係を覚えよう!」に登場した「絞り」も、ルート2が大きなポイントでした。 Webデザインに白銀比を取り入れようとした場合、全体の横幅と横幅の比からそれぞれの幅を求める必

    【白銀比・計算ツール・2カラム対応】 - 白銀比計算ツール
  • jQueryで作るAmazon流リキッドレイアウト (1/5)

    国内外を問わず、多くのECサイトがお手とする「Amazon.co.jp」。この連載でも以前、Amazonが採用する「カルーセル」(回転表示するスライドパネル)の作り方を紹介しましたが(関連記事)、Amazonは優れたユーザーインターフェイス(UI)の宝庫でもあります。 中でも、過去の閲覧履歴などからページの大半が動的に生成されるAmazon.co.jpのトップページは、ユーザーを商品購入へと導くさまざまな仕掛けが組み込まれています。今回は、このAmazon.co.jpのトップページに注目します。 今回のお手サイト:『Amazon.co.jp』 米アマゾン・ドットコムの日法人アマゾンジャパンが2000年から運営するECサイト。書籍販売から始まり、現在ではペットボトル飲料水や紙おむつ、キッチン家電まで1000万点超の膨大な商品を扱っている。取扱商品の拡大に合わせて、2008年4月に大規模

    jQueryで作るAmazon流リキッドレイアウト (1/5)
  • 1