关于Progress(进度)制作自动适应导航的兼容性解决办法

dcl

swiper-container宽度是480px，这样swiper-slide获得的宽度是整数，这样运行是没问题，但是当swiper-container改变swiper-slide获得的宽度不是整数带有小数的时候就会出现问题。怎样解决。 <div class="swiper-container" id="swiper-container2" style="width:480px;">
	<div class="swiper-wrapper">
	<div class="swiper-slide active-nav">
	版块1</div>
	<div class="swiper-slide">
	版块2</div>
	<div class="swiper-slide">
	版块3</div>
	<div class="swiper-slide">
	版块4</div>
	<div class="swiper-slide">
	版块5</div>
	<div class="swiper-slide">
	版块6</div>
	<div class="swiper-slide">
	版块7</div>
	<div class="swiper-slide">
	版块8</div>
	</div>
	</div>
	<div class="swiper-container" id="swiper-container3" style="width:480px;">
	<div class="swiper-wrapper">
	<div class="swiper-slide blue-slide">
	slider1</div>
	<div class="swiper-slide red-slide">
	slider2</div>
	<div class="swiper-slide orange-slide">
	slider3</div>
	<div class="swiper-slide blue-slide">
	slider4</div>
	<div class="swiper-slide red-slide">
	slider5</div>
	<div class="swiper-slide orange-slide">
	slider6</div>
	<div class="swiper-slide blue-slide">
	slider7</div>
	<div class="swiper-slide red-slide">
	slider8</div>
	</div>
	</div>
	<script>
	var mySwiper2 = new Swiper('#swiper-container2',{
	watchSlidesProgress : true,
	watchSlidesVisibility : true,
	slidesPerView : 3,
	onTap: function(){
	mySwiper3.slideTo( mySwiper2.clickedIndex)
	}
	})
	var mySwiper3 = new Swiper('#swiper-container3',{
	onSlideChangeStart: function(){
	updateNavPosition()
	}
	})
	function updateNavPosition(){
	$('#swiper-container2 .active-nav').removeClass('active-nav')
	var activeNav = $('#swiper-container2 .swiper-slide').eq(mySwiper3.activeIndex).addClass('active-nav');
	if (!activeNav.hasClass('swiper-slide-visible')) {
	console.log(1);
	if (activeNav.index()>mySwiper2.activeIndex) {
	console.log(2);
	var thumbsPerNav = Math.floor(mySwiper2.width/activeNav.width())-1
	mySwiper2.slideTo(activeNav.index()-thumbsPerNav)
	}
	else {
	console.log(3);
	mySwiper2.slideTo(activeNav.index())
	}
	}
	}
	</script>