javascript - jQuery組積造を下から上に

Question

jQuery組積造スタックを下から上に作成する方法を知っている人はいますか？私は物事を下から上に積み上げるためにいくつかの基本的なJSを書きましたが、次のレンガを最短の列に積み重ねたり、複数の列にまたがるレンガを積み重ねたりするような石積みのようなことはできませんでした。私は数学が苦手なので、ソースコードを見るとめまいがします。

誰でも試してみたいですか？

Answer 1

これがいかに簡単であるかを笑うつもりですが、プラグインを変更する必要があります（デモ）。

基本的に、82行目から85行目をこれから変更しました（変更が必要なのはに変更することだけでしtopたbottomが、前後に切り替えることができるように両方を追加しました）：

    var position = {
      left: props.colW * shortCol + props.posLeft,
      top: minimumY
    };

これに：

    var position = (opts.fromBottom) ? {
      left: props.colW * shortCol + props.posLeft,
      bottom: minimumY
    } : {
      left: props.colW * shortCol + props.posLeft,
      top: minimumY
    };

次に、デフォルトにオプションを追加しました。

  // Default plugin options
  $.fn.masonry.defaults = {
    singleMode: false,
    columnWidth: undefined,
    itemSelector: undefined,
    appendedContent: undefined,
    fromBottom: false, // new option
    saveOptions: true,
    resizeable: true,
    animate: false,
    animationOptions: {}
  };

これで、次のようなプラグインを使用できます。

$('#masonry').masonry({ fromBottom: true });

---

更新：私はgithubのリポジトリもフォークしたので、自分で変更したくない場合は、変更をダウンロードするだけです。