Как сделать слайдер (с прогрессбаром)?

Question

[tekkenot95]

Нужно сверстать слайдер и воссоздать эффекты с прогрессбаром, как это реализовать ?

Answer 1

[Ruslan Ruslanov]

2 блока, блок а и блок б.
Блок а будет бекграундом. Делаем ему длину большую (сколько вам надо? 500 px хватит?), А ширину маленькую (50 px?).
Блок б суем внутрь, ширину делаем inherit, длину 0, background (-color) устанавливаем.
В зависимости от величины прогресса устанавливаем длину блока б (в %, естественно, от родителя же считается).

var perc = num/count * 100; //величина прогресса
if (perc !== 0 || perc !== undefined) {
  perc = perc.toFixed();
}
inline.style.width = perc + "%";

</div>
    <div id="line" class="line">
        <div id="inline" class="inline"></div>
    </div>

Comments

[Никитос Албанов]

в js вы не указывали откуда брать данные для скроллбара, это не важно?

Answer 2

[Makssof]

Slick slider progress bar?

Comments

[tekkenot95]

Нет, вот типо этого

[Makssof]

tekkenot95, превью?

Answer 3

[Александр]

Autoplay
Ну и пишете функцию, которое показывает прогресс бар в зависимости от установленной задержки