Scalable.jsを使用して自動サイズ変更要素を作成する
もしあなたが必要ならば コンテナを自動入力する柔軟な要素を作る Scalableを強くお勧めします。この無料のオープンソースJSスクリプトは、あまりストレスをかけずに流動的なデザインを作成するのに最適です。.
Scalable.jsライブラリ内のすべては順応性があるため、すべてのコンテナのスタイル、サイズ、位置、および内部の内容を変更できます。要素をページの上部または下部に配置する必要がありますか。 Scalableにはそのためのオプションがあります.
これがどのように機能するかについてもっと学ぶためにGitHubレポジトリを覗いてみてください.
最も基本的な形式では、このスクリプトはターゲットページ要素と表示をカスタマイズするためのいくつかのオプションを取ります。これはGitHubから直接取ったいくつかのサンプルコードです:
var scalable = new Scalable(containerEl、options);
当然ながら、最初のパラメータは、ターゲットとするコンテナ要素のいずれかです(理想的には、 optionsパラメータはkey => valueの組の配列を取ります。これらのオプションは次のとおりです。 コンテナの高さの値、最小幅と最大幅、最小スケールと最大スケール (つまり、内部要素に合わせてどれだけ拡張できるか). 使用可能なデモについては、メインのプロジェクトページをご覧ください。コンテナの四隅をドラッグして、内側のフレキシブルアイテムのサイズを自動的に変更できます。その領域の下にあなたが見つけるので、これはかなりクールです。 使用可能なコード ページから直接取得. 純粋なCSSだけで柔軟な要素を処理する方法があります。しかし、これらのメソッドは時代遅れに感じることがあり、JavaScriptほどの制御はできません。. 試してみたいのであれば、GitHubからコピーを入手して、あなたが何を考えているのかを見てください。. Scalableはまだ活発に開発されていますが、ニーズに合わせて編集するのが簡単なスクリプトです。.