Search the Community

Здравствуйте. На сайте стоит слайдер Owl. Потрубовался функционал от него - thumbnail. Дописан следующим образом // 1 - assign each 'dot' a number dotcount = 1; jQuery('.owl-carousel_4 .owl-dot').each(function() { jQuery( this ).addClass( 'dotnumber' + dotcount); jQuery( this ).attr('data-info', dotcount); dotcount=dotcount+1; }); // 2 - assign each 'slide' a number slidecount = 1; jQuery('.owl-carousel_4 .owl-item').not('.cloned').each(function() { jQuery( this ).addClass( 'slidenumber-item slidenumber' + slidecount); slidecount=slidecount+1; }); // sync the slide number img to its dot counterpart (e.g slide 1 img to dot 1 background-image) jQuery('.owl-carousel_4 .owl-dot').each(function() { grab = jQuery(this).data('info'); slidegrab = jQuery('.slidenumber'+ grab +' img').attr('src'); console.log(slidegrab); jQuery(this).css("background-image", "url("+slidegrab+")"); }); // this final bit can be removed and overriden with your own css or function, i just have it // to make it all neat amount = jQuery('.owl-carousel_4 .owl-dot').length; // gotowidth = (100/amount)-1.2; jQuery('.owl-carousel_4 .owl-dot').css("width", 60+"px"); newwidth = jQuery('.owl-dot').width(); jQuery('.owl-carousel_4 .owl-dot').css("height", 50+"px");<div class="owl-carousel_4"> <div><img src="http://imew.co.uk/wp-content/uploads/2014/04/SB4.png"></div> <div><img src="http://imew.co.uk/wp-content/uploads/2014/04/SB3.png"></div> <div><img src="http://imew.co.uk/wp-content/uploads/2014/04/SB2.png"></div> <div> <img src="http://imew.co.uk/wp-content/uploads/2014/04/SB1.png"></div></div>Нажать на "modal" на сайте http://kates.cc.ua/top-matras-new/index.html http://joxi.ru/bmoO8NWcPjlWmy- вот что имеем. но вызвав дебагер все становится как надо http://joxi.ru/krD95KOSb3dqmp или в обратном порядке с изначально включенным дебагером http://joxi.ru/Y2LqRxXtj8vBA6 и убирая его http://joxi.ru/a2XeJ03SG7pNAg Что-то я не знаю, в чем причина. Посоветуйте решение или другой хороший гибкий слайдер - на случай всего пропало