Фонд 5 и эквалайзер

Я постараюсь задать это здесь, потому что на форумах Фонда я не получил ответа. Я делаю смешанный макет, и я хочу использовать эквалайзер, чтобы первый столбец и второй столбец одинаковой высоты. Подвох в том, что второй столбец - это еще один макет сетки. Внутри этой второй сетки Эквалайзер работает как шарм, но между первым и вторым столбцом ничего не делает. Я искал здесь, и есть много людей с похожими проблемами, но я не нашел решения для смешанного макета, даже с простыми функциями jQuery. Кто-нибудь может помочь?

Вот код:

<div class="row">
<div class="large-12 columns">
  <div class="row" data-equalizer>
    <!-- first column -->
    <div class="large-2 small-2 columns">
        <div class="panel" data-equalizer-watch>
        <!-- here goes an image -->
        </div>
    </div>
    <!-- second column -->
    <div class="large-10 small-10 columns" data-equalizer-watch>
        <div class="row" data-equalizer>
            <div class="large-4 small-12 columns">
                <p class="panel" data-equalizer-watch>Text</p>
            </div>
            <div class="large-4 small-12 columns">
                <p class="panel" data-equalizer-watch>Text</p>
            </div>
            <div class="large-4 small-12 columns">
                <p class="panel" data-equalizer-watch>Text</p>
            </div>
        </div>

        <div class="row">
            <div class="large-12 small-12 columns">
                <p class="panel">Longer text</p>
            </div>
        </div>

        <div class="row" data-equalizer>
            <div class="large-4 small-12 columns">
                <p class="panel" data-equalizer-watch>Text</p>
            </div>
            <div class="large-4 small-12 columns">
                <p class="panel" data-equalizer-watch>Text</p>
            </div>
            <div class="large-4 small-12 columns">
                <p class="panel" data-equalizer-watch>Text</p>
            </div>
        </div>

         <div class="row">
            <div class="large-12 small-12 columns">
                <p class="panel">Longer text</p>
            </div>
        </div>
    </div>
  </div>


</div>

1 ответ

Решение

Я проверил на версии 5.2.2: вы просто не можете это сделать.

Я посмотрел на файл Foundation foundation.equalizer.js, эта функция просто не подходит для выравнивания эквалайзера внутри эквалайзера.

В версии 5.2.2 в строке 30 вы можете видеть, как выбираются элементы для выравнивания:

vals = equalizer.find('[' + this.attr_name() + '-watch]:visible')

Между уровнями домина нет гадости, он ловит каждого data-equalizer-watch не ища data-equalizer внутри data-equalizer

Другие вопросы по тегам