私は UX デザイナーで、プロジェクトの Masonry インターフェイスを調査しています。
独自のブロック (さまざまなサイズの写真) をアップロードし、パラメーターをいじって、それらがレイアウトにどのように影響するかを確認したいと考えています。「アップロード」オプションのあるオンライン デモを探しましたが、見つかりませんでした。
私は UX デザイナーで、プロジェクトの Masonry インターフェイスを調査しています。
独自のブロック (さまざまなサイズの写真) をアップロードし、パラメーターをいじって、それらがレイアウトにどのように影響するかを確認したいと考えています。「アップロード」オプションのあるオンライン デモを探しましたが、見つかりませんでした。
http://masonry.desandro.com/にアクセスすると、ダウンロードするコードとともに多数のデモが表示されます。
お役に立てれば。
バージョンはhttp://benholland.me/javascript/how-to-build-a-site-that-works-like-pinterest/にあります。無料で重くない wookmark jquery プラグインもあります: http://www.wookmark.com/jquery-plugin。JS での 2d-bin-packing の例を次に示します: http://incise.org/2d-bin-packing-with-javascript-and-canvas.html。同じ開発者によるパッケージもあります。
Visual Studio Web Developer 2010 Express を使用し、Desandro の masonry.js でローカルホスト サイトを作成します。ここにあります。使用するのはかなり単純です。</body>
正しく機能させるために、終了タグの前にスクリプト コードを配置する必要がありましたが、他のアプリケーションでは異なる場合があります。そして、jquery.js を入手する必要があります。Desandro (メイソンリーのコーダー) が、彼のサイトでそれを実装する方法を教えてくれます。
Masonry.js は無料で使用できますが、商業的に使用するために 25 ドルを支払わない限り、アイソトープは非営利的です。