I'm using the bxslide plugin, so when I load the page it works normally, but when I refresh it, it rips the images showing all the slides, not the JS error, but when I change the page size even with it bugged it back to working normally.
I load before closing the body
<script src="<%=ConfigurationManager.AppSettings("URL").ToString() %>/js/jquery.min.js"></script>
<script src="<%=ConfigurationManager.AppSettings("URL").ToString() %>/js/jquery.bxslider.min.js"></script>
After the above script comes the call:
jQuery(document).ready(function ($) {
$('.bxslider').bxSlider({
auto: true,
minSlides: 1,
maxSlides: 4,
slideWidth: 300,
speed: 1000,
pause: 6000,
slideMargin: 100
});
});
aftermanuallyresizingthebrowserwindowitreturnstonormal
htmlslidebuggycode:
<div class="bx-wrapper" style="max-width: 1500px;"><div class="bx-viewport" style="width: 100%; overflow: hidden; position: relative; height: 0px;"><ul class="bxslider" style="width: 1015%; position: relative; transition-duration: 0s; transform: translate3d(-840px, 0px, 0px);"><li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/130978001.jpg" alt="Gidesac Publicidade">
</li><li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/1308962.jpg" alt="Anita Depiladora Eletrólise e Depilação">
</li><li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/130593501.jpg" alt="Rede Sintonia">
</li><li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/131318301.jpg" alt="Marcos Estevam Duarte Climed">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/131228201.jpg" alt="Dedetizadora Borges">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/130978305.jpg" alt="Ambientos">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/131890902.jpg" alt="Cito Laboratório de Citopatologia Ltda">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/130978304.jpg" alt="Detalhe Decorações">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/130978001.jpg" alt="Gidesac Publicidade">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/1308962.jpg" alt="Anita Depiladora Eletrólise e Depilação">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/130593501.jpg" alt="Rede Sintonia">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;">
<img src="img/Home-Slider/131318301.jpg" alt="Marcos Estevam Duarte Climed">
</li>
<li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/131228201.jpg" alt="Dedetizadora Borges">
</li><li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/130978305.jpg" alt="Ambientos">
</li><li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/131890902.jpg" alt="Cito Laboratório de Citopatologia Ltda">
</li><li width="300px" style="width: 100px; float: left; list-style: none; position: relative; margin-right: 100px;" class="bx-clone">
<img src="img/Home-Slider/130978304.jpg" alt="Detalhe Decorações">
</li></ul></div><div class="bx-controls bx-has-pager bx-has-controls-direction"><div class="bx-pager bx-default-pager"><div class="bx-pager-item"><a href="" data-slide-index="0" class="bx-pager-link active">1</a></div><div class="bx-pager-item"><a href="" data-slide-index="1" class="bx-pager-link">2</a></div><div class="bx-pager-item"><a href="" data-slide-index="2" class="bx-pager-link">3</a></div><div class="bx-pager-item"><a href="" data-slide-index="3" class="bx-pager-link">4</a></div><div class="bx-pager-item"><a href="" data-slide-index="4" class="bx-pager-link">5</a></div><div class="bx-pager-item"><a href="" data-slide-index="5" class="bx-pager-link">6</a></div><div class="bx-pager-item"><a href="" data-slide-index="6" class="bx-pager-link">7</a></div><div class="bx-pager-item"><a href="" data-slide-index="7" class="bx-pager-link">8</a></div></div><div class="bx-controls-direction"><a class="bx-prev disabled" href="">Prev</a><a class="bx-next disabled" href="">Next</a></div></div></div>