Суть проблемы в том что если перейти на любую другую вкладку в браузере а вкладку со скриптом не закрывать то когда возвращаешься на вкладку со скриптом он начинает супер быстро пролистывать блоки как будто догонят то время которые ты проводил на второй вкладке.
<div class="carousel">
<div class="carousel-button-left"><a href="#"></a></div>
<div class="carousel-button-right"><a href="#"></a></div>
<div class="carousel-wrapper">
<div class="carousel-items">
<div class="carousel-block">
<img src="images/1.jpg" alt="" />
</div>
<div class="carousel-block">
<img src="images/2.jpg" alt="" />
</div>
<div class="carousel-block">
<img src="images/3.jpg" alt="" />
</div>
<div class="carousel-block">
<img src="images/4.jpg" alt="" />
</div>
<div class="carousel-block">
<img src="images/5.jpg" alt="" />
</div>
<div class="carousel-block">
<img src="images/6.jpg" alt="" />
</div>
<div class="carousel-block">
<img src="images/7.jpg" alt="" />
</div>
<div class="carousel-block">
<img src="images/8.jpg" alt="" />
</div>
</div>
</div>
<style>
.carousel {
max-width: 1080px;
margin: 50px auto;
width:100%;
}
.carousel-wrapper {
margin: 10px 30px;
overflow: hidden;
position:relative;
}
.carousel-items {
width: 10000px;
position: relative;
}
.carousel-block {
float: left;
width: 250px;
padding: 10px 10px 10px 0px;
}
.carousel-block img{
display:block;
}
.carousel-button-left a, .carousel-button-right a{
width: 25px;
height: 36px;
position: relative;
top: 80px;
cursor: pointer;
text-decoration:none;
}
.carousel-button-left a{
float: left;
background: url(../images/carousel-left.png);
}
.carousel-button-right a{
float: right;
background: url(../images/carousel-right.png);
}
</style>
<script>
//Обработка клика на стрелку вправо
$(document).on('click', ".carousel-button-right",function(){
var carusel = $(this).parents('.carousel');
right_carusel(carusel);
return false;
});
//Обработка клика на стрелку влево
$(document).on('click',".carousel-button-left",function(){
var carusel = $(this).parents('.carousel');
left_carusel(carusel);
return false;
});
function left_carusel(carusel){
var block_width = $(carusel).find('.carousel-block').outerWidth();
$(carusel).find(".carousel-items .carousel-block").eq(-1).clone().prependTo($(carusel).find(".carousel-items"));
$(carusel).find(".carousel-items").css({"left":"-"+block_width+"px"});
$(carusel).find(".carousel-items .carousel-block").eq(-1).remove();
$(carusel).find(".carousel-items").animate({left: "0px"}, 200);
}
function right_carusel(carusel){
var block_width = $(carusel).find('.carousel-block').outerWidth();
$(carusel).find(".carousel-items").animate({left: "-"+ block_width +"px"}, 200, function(){
$(carusel).find(".carousel-items .carousel-block").eq(0).clone().appendTo($(carusel).find(".carousel-items"));
$(carusel).find(".carousel-items .carousel-block").eq(0).remove();
$(carusel).find(".carousel-items").css({"left":"0px"});
});
}
$(function() {
auto_right('.carousel:first');
})
// Автоматическая прокрутка
function auto_right(carusel){
setInterval(function(){
if (!$(carusel).is('.hover'))
right_carusel(carusel);
}, 1000)
}
// Навели курсор на карусель
$(document).on('mouseenter', '.carousel', function(){$(this).addClass('hover')})
//Убрали курсор с карусели
$(document).on('mouseleave', '.carousel', function(){$(this).removeClass('hover')})
</script>
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Помогите пожалуйста приклеить изображение в правый блок на всю высоту экрана, с нулевыми отступами, как на изображенииВозможно без использование...
Подскажите, можно ли как-то настроить автокомплит js в файлах HTML? Я уже всякое перепробовал и ничего не получаетсяКогда создаю файл