原則として、これは悪くありません。 彼の職業の詳細に基づいて、正しく使用する場合、順序とモジュラーグリッドを愛する必要があります。それらは、生活を大幅に簡素化し、レイアウトレイアウト中に快適な調和を作ります。
モジュラーグリッドについて少し
モジュラーレイアウトシステムは、ストライプとターンの構成の基礎が、水平または垂直に同じまたは異なる特定のステップ(モジュール)を持つモジュラーグリッドであるレイアウトシステムです。 ウィキペディアに基づいています。
さらにいくつかのリンク:
http://cherenkevich.livejournal.com/38085.html
www.htmlbook.ru/content/?id=79
また、モジュラーグリッドについてHabréで複数回書いています。
グリッドのディストリビューターの1つは、悪名高い960.gsフレームワークになりました。 現在、それらの多くがあり、自尊心のあるCSSフレームワークは、魔法の言葉グリッドなしではできません:)、たとえば、同じブループリント 。
この流行のトレンドに続いて、このスタックまたはそのスタック(もちろん960.gsが多い)で作成されたレイアウトは、レイアウトにますます頻繁になります。 もちろん、多くのツールとメッシュジェネレーターが登場しましたが、不便でした。 グリッドを毎回生成してcssに埋め込むのは不便です。 編集するのは難しく、オフにするのは難しいです。 多くの場合、さまざまなバグがさまざまなブラウザで表示されます。
はい、Firefoxにはいくつかのツールがあります。 最初のマイナス点は、それらの多くはありません-Web DeveloperとGridFoxです。 そして、2番目に重要なマイナスは、Firefoxでのみ機能します。 すべてのブラウザで動作するようにしたかった。
また、非常によく似た別のアナログhttp://gridder.andreehansson.se/もありますが、やはり960に厳密にバインドされています...しかし、アイデアと実装は非常に似ています。
まだ残っているかもしれませんが、それはすでにあまりにも面倒でした。
夢では、小さなソケットを作りたいと思っていました。それを使って、任意のグリッド(オプション960)を作成し、どこにでも挿入できます。 そして、グリッド上のデータが保存され、どのブラウザーでも機能することを確認します。
だから、これはとても短いリストで、夢から現実になったものです。
最後に何が起こったのですか?
- 小さなJavaScriptスクリプト。 10 Kb未満として圧縮されます。
- JavaScriptをサポートする任意のブラウザーで動作します:)
- モジュール式メッシュを作成できます。
- 垂直リズムのバランスをとるための特別な型( Lines )(たとえば、垂直リズムはここにあります )。
- Cookieにデータをローカルに保存します。
- 任意の場所に(IDで)挿入できます。
- 設定では、測定単位を指定できます(オプションですが、今後はインターフェースに転送します)。
図 1- 動作中のグリッドの拡張
使い方は? とても簡単です。 3つのjsファイルを接続するだけです。 接続されているファイルの数で誰かが混乱している場合、それらを1つにまとめることができます。 便宜上、Extend Gridは、ローカライズ、設定、およびメインスクリプト自体の3つの部分に分かれています。
例:
<script type="text/javascript" src="http://grid.wlcteam.ru/1.1/extend.grid.ru.pack.js"></script>
<script type="text/javascript" src="http://grid.wlcteam.ru/1.1/extend.grid.settings.js"></script>
<script type="text/javascript">
// ( ID)
var parentGridLayout = "wrapper";
</script>
<script type="text/javascript" src="http://grid.wlcteam.ru/1.1/extend.grid.min.js"></script>
すべてのソースはこちらです。
すべてを単一のアーカイブにダウンロードすることもできます 。
しかし、短所なしではない
各ブラウザで、データを再入力する必要があります。
プロジェクトへの分割はありません。 もちろん、設定でCookieを使用して共有することもできますが、インターフェイスでお願いします。
インターフェイスの欠点。 現時点では、ピクセルへの明確な参照。 はい、設定で変更できますが、測定単位はグローバルで、列と列の両方のすべてのモジュールに適用されます。
原則的に修正可能なインターフェースの主な欠点。 しかし、一般的に、いくつかのプロジェクトでの戦闘テストの後、Extend Gridはすでに成果を上げています。
計画
コードを書き直して、jQueryプラグインにします。
上記の短所を修正します。
たとえば、ルーラーなどのいくつかの機能を追加します。
そして、実際にバグレポートと希望を収集します。