[JS]レスポンシブ対応、指定したエリア内だけで高さが異なるパネルを同じ高さに揃えるスクリプト -Right Height
1-3、4-6でエリアを指定、1-3と4-6が同じ高さに Right Heightの使い方 Step 1: スクリプトの準備 当スクリプトを外部ファイルとして記述し、初期化しておきます。 スクリプトは、これで完了。 <body> ... コンテンツ ... <script src="js/right-height.js"></script> <script> rightHeight.init(); </script> </body> Step 2: HTML HTMLのポイントは、2つ。 data-right-height 適用するエリアを指定 data-right-height-content 適用する要素を指定 <div class="row" data-right-height> <div class="grid-third" data-right-height-content> 1
![[JS]レスポンシブ対応、指定したエリア内だけで高さが異なるパネルを同じ高さに揃えるスクリプト -Right Height](https://cdn-ak-scissors.b.st-hatena.com/image/square/6d7b12bef628f068421e02247872e8a530b7b5ee/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201502%2F2015091000.png)
ウェブサイトやブログによくあるリストデザインが流行のグリッドデザインよりも有効なわけ
「ウェブの未来を担う次のUIデザインは『カード』にあり」と言われるなど、ウェブサイトを格子状にレイアウトしたグリッドデザインは人気で、多くのアプリやウェブサイトで採用されていますが、実際にグリッドデザインと以前からあるリストデザインの2種類をテストしてみたところ、「リストデザインの方が明らかに見やすく、ユーザーの反応がいい」という結論が出ました。 List Beats Grid: Linear Feeds Perform Two to Three Times Better Than Grids http://blog.getprismatic.com/list-beats-grid-linear-feeds-perform-two-to-three-times-better-than-grids-2/ グリッドデザインとリストデザインのどちらが本当に効果的なのか？ということを調査したのはソ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
