Добавление элементов - прекращение добавления, когда элементы начинают переполнять контейнер - PullRequest
Новая
       21

Добавление элементов - прекращение добавления, когда элементы начинают переполнять контейнер

0 голосов
/ 29 марта 2012

Я пытаюсь разобрать «доску», где вы можете добавлять элементы разных размеров, используя кладку, и я пытаюсь выяснить, как остановить возможность добавления новых элементов, если контейнер заполнен и элементы начинают его переполнять.

код:

HTML 

<input id="width" value="0" type="text"></input>
<input id="height" value="0" type="text"></input>
<input id="mLeft" value="0" type="text"></input>
<input id="mRight" value="0"type="text"></input>
<button>Add container</button>

JQuery 

$('button').click(function(){
    var $pWidth = jQuery("#width").val();
    var $truePWidth = $pWidth * 15;
    var $pHeight = jQuery("#height").val();
    var $truePHeight = $pHeight * 15;
    var $mLeft = jQuery("#mLeft").val();
    var $trueMLeft = $mLeft * 15;
    var $mRight = jQuery('#mRight').val();
    var $trueMRight = $mRight * 15;
    $container.append("<div class='box'><div class='remove'></div></div>").masonry( 'reload', function(){
           $(".box").each(function(i) {
                 $(this).attr("id", "item"+(i+1));
            });
        $($container).children('.box:last-child').css({'height' : $truePHeight + 'px', 'width': $truePWidth + 'px', 'margin-right' : $trueMRight + 'px', 'margin-left' : $trueMLeft + 'px' });
        $container.masonry( 'reload');
    } );

});

Контейнер (var $ container = #container), в который добавляются элементы (.box), имеет высоту 1600px.

Заранее спасибо!

/ Jonas

1 Ответ

0 голосов
/ 29 марта 2012

Я прошу прощения.Я нахожусь на моем телефоне, поэтому я не могу сделать код, но вы можете просто установить CSS для контейнера следующим образом: 

.box {
     max-height: 1600px;
     overflow-y: scroll;
 }

Это даст контейнеру полосу прокрутки вместо увеличения высотыконтейнер, в то же время позволяя пользователям добавлять неограниченное количество ящиков.

...