Мне нужно реализовать плавный переход, от NONE к BLOCK. Изучая примеры никак не могу понять, как сделать это на чистом JS, везде примеры на jquery.
css:
.slide {
display: none;
position: absolute;
opacity: 0;
list-style: none;
}
.show {
display: block;
position: relative;
opacity: 1;
}
js:
var slide = document.getElementById('slider');
var slides = slide.getElementsByTagName('div');
var currentSlide = 0;
function leftBtn() {
slides[currentSlide].className = 'slide';
currentSlide = (++currentSlide)%slides.length;
slides[currentSlide].className = 'slide show';
}
function rightBtn() {
slides[currentSlide].className = 'slide';
currentSlide = (--currentSlide + slides.length) % slides.length;
slides[currentSlide].className = 'slide show';
}
display:none
кdisplay:block
не анимируется. Плавности нужно добиваться другими средствами. – Stepan Kasyanenko 8 ноя '18 в 11:30html
разметки, а также от задачи. Какого рода анимацию вы хотите? – Stepan Kasyanenko 8 ноя '18 в 11:38