[JS]ページにグリッドを重ねてカラムのサイズを自動算出するスクリプト

ウェブページにグリッドをオーバーレイさせて、レイアウトのチェックができるスクリプトをDev Growから紹介します。

デモのキャプチャ

Griddy: Simple Grid Overlay Plugin for JQuery

デモでは、右上の「Toggle Griddy」をクリックすると、グリッドをレイアウトにオーバーレイで表示します。

デモのキャプチャ

デモページ

カラムの幅と高さの数値は自動的に表示されるもので、カラムとスペースの数によって算出されています。

グリッドを表示するためには、予め下記の数値を記述する必要があります。
`※デフォルト値は設定されています。

  • 横のカラムの数
  • 横のスペースの数
  • 横のカラムの高さ
  • 縦のカラムの数
  • 縦のスペースの貸す
  • 縦のスペースの幅
  • オーバーレイの色
  • オーバーレイの透明度

sponsors

top of page

©2018 coliss