загрузчик держит 4 картинки в линию, даже если стиль скрыть

Question

у меня есть код, имеющий 4 рис. В строке через загрузчик, но функция ihave, которая скрывает некоторые рис.и если я покажу им, что они в первый раз.нажмите скрыть, я хочу видеть:

V1 V3 V5 V6

V8

, а не

V1 V3

V5 V6 V8

Я пытаюсь сделать JS-код, чтобы сделать их на месте, но у меня не получилось. А также я удалил строку div, но не работает.

спасибо.

Answer 1

Я обновил вашу скрипку , чтобы она заработала.Вам необходимо настроить следующие пункты:

1) col-ms-3 не является допустимым классом начальной загрузки.Я думаю, что вы хотите использовать <div class="col-sm-3"> (для небольших устройств и выше) или <div class="col-3"> (для всех устройств).Посмотрите здесь

2) Если вы хотите решить свою проблему, вы не можете использовать <div class="row"> для каждой строки.НО вы можете создать одну родительскую строку и поместить все элементы туда.Использование <div class="col-sm-3"> или <div class="col-3"> гарантирует, что вы получите 4 элемента: row.

<div class="row">
    <div class="col-3">
    <div class="col-3">
    <div class="col-3">
    <div class="col-3">
    <!-- row two will automatically start -->
    <div class="col-3">
    <div class="col-3">
    <div class="col-3">
    <div class="col-3">
</div>

3) Вы используете document.getElementById("v2").style.display, чтобы скрывать и отображать элементы, но ваша структура следующая:

<div class="col-3"> 
    <div id="v1">

На самом деле вы хотите скрыть / показать родительский элемент идентификатора элемента, поэтому используйте вместо него document.getElementById("v2").parentNode.style.display.

Подсказка: Изображения с различными размерами могут привести к ошибкам, в то время какотображение.Вам нужно дополнительно изучить и динамически добавить class="row".