Показать сообщение отдельно
  #8 (permalink)  
Старый 30.01.2019, 19:29
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Сообщение от DrewSherwood
да, должно получится именно так
А надо с элементами на странице? Тогда типа такого

<style>
.row div {
    width: 100px;
    margin: 0 5px 5px 0;
    display: inline-block;
    vertical-align: top;
}
.blue div {
    background-color: #00f;
}
.red div {
    background-color: #f00;
}
.green div {
    background-color: #0f0;
}
</style>

<div class="row blue">
    <div style="height:50px"></div>
    <div style="height:90px"></div>
    <div style="height:30px"></div>
</div>
<div class="row red">
    <div style="height:15px;"></div>
    <div style="height:55px"></div>
    <div style="height:34px"></div>
</div>
<div class="row green">
    <div style="height:80px"></div>
    <div style="height:20px"></div>
    <div style="height:38px"></div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
var offset = [0, 0, 0], max;
$('.row').each(function(i, e) {
    if(!i) {
        $(e).children().each(function(k, o) {
            offset[k] += o.offsetHeight
        })
    } else {
        max = Math.max(...offset);
        $(e).children().each(function(k, o) {
            offset[k] += $(o).css({marginTop: -(max-offset[k])}).height()
        
        })
    }
})
</script>

Последний раз редактировалось laimas, 30.01.2019 в 19:31.
Ответить с цитированием