Boa tarde pessoal!!!
Preciso muito da ajuda de vocês.
Eu estou começando na área de Web e estou com um problema que não consigo resolver.
Eu criei um site no qual eu usei o jQuery e o plugin jQuery Cycle e toda vez que eu mudo de página nos botões do menu, ele pisca.
Eu gostaria de saber se alguém pode me ajudar a resolucionar esse problema.
Segue o meu código abaixo:
<!doctype html>
<html lang="en,fr">
<head>
<meta charset="UTF-8" />
<title>Sentimental Moments Event Decor</title>
<link rel="stylesheet" type="text/css" href="CSS/Normalize.css" />
<link href='http://fonts.googleapis.com/css?family=Lato:400, 700' rel='stylesheet' type='text/css' />
<link rel="stylesheet" type="text/css" href="CSS/Estilo.css" />
<script type="text/javascript" src="jQuery/jquery.js"></script>
<script type="text/javascript" src="jQuery/jquery.cycle2.min.js"></script>
<script type="text/javascript">
$(function(){
var liWidth = $("slide ul li").outerWidth(),
speed = 3500,
rotate = setInterval(auto, speed);
//Mostra os botões
$("section#slide").hover(function(){
$("section#buttons").fadeIn();
clearInterval(rotate);
}, function(){
$("section#buttons").fadeOut();
rotate = setInterval(auto, speed);
});
//Next
$(".next").click(function(e){
e.preventDefault();
$("section#slide ul").css({'width':'99999%'}).animate({left:-liWidth}, function(){
$("#slide ul li").last().after($("#slide ul li").first());
$(this).css({'left':'0', 'width': 'auto'});
});
});
//Voltar
$(".prev").click(function(e){
e.preventDefault();
$("#slide ul li").first().before($("#slide ul li").last().css({'margin-left':-liWidth}));
$("section#slide ul").css({'width':'99999%'}).animate({left:liWidth}, function(){
$("#slide ul li").first().css({'margin-left':'0'});
$(this).css({'left':'0', 'width':'auto'});
});
});
function auto(){
$(".next").click();
}
});
</script>
</head>
<body>
<div id="header">
<div class="linha">
<header>
<div class="coluna col12 sidebar"></br>
<nav>
<ul class="menu inline sem-marcador">
<li><a href="index.html"><strong>HOME</strong></a></li>
<li><a href="about.html"><strong>ABOUT US</strong></a></li>
<li id="selection"><a href="photo.html"><strong>PHOTO GALLERY</strong></a></li>
<li><a href="inventory.html"><strong>INVENTORY</strong></a></li>
<li><a href="contact.html"><strong>CONTACT</strong></a></li>
<li><a href="photo1.html"><strong>EN</strong></a></li>
</ul>
</nav>
</div>
</div>
<div class="cycle-slideshow">
<img src="IMG/book3.jpg" width="600" Alt="" /><img src="IMG/book4.jpg" width="600" Alt="" /><img src="IMG/book5.jpg" width="600" Alt="" /><img src="IMG/book6.jpg" width="600" Alt="" />
</div>
<div class="text">
<div class="linha" >
<div class="coluna col12">
<center><h2><strong><em>OUR CREATION IS YOUR HAPPINESS!!</em></strong></h2></center>
</div>
</div>
</div>
</header>
</div>
</div>
<div class="image">
<div class="linha">
<div class="coluna col12">
<p>Have a beautiful decoration, with designs that will further enhance the space of your event.</br> Sentimental Moments Event Decor through a competence, creates beautiful scenery, using quality flowers, as well as furniture and details that will only give life to the ceremony and the party.</p>
<p>We are specialized in personalised vintage and rustic decor.</p></br>
<h3>VINTAGE:</h3>
<p>The vintage style is influenced in several ways by the decoration dating from the period after the Second World War.</br> In Europe, it is a difficult time to rebuild everything that has been trampled on by the war, physically and spiritually.</p>
<p>The vintage style thus brings an extremely interesting atmosphere which is at the same time marked by the nostalgia of the past and by the optimism of the renewal.</p>
<p>Check out some work done in the gallery!</p>
<section id="slide">
<section id="buttons">
<a href="#" class="prev">«</a>
<a href="#" class="next">»</a>
</section>
<ul>
<li>
<img src="IMG/cage2.jpg">
</li>
<li>
<img src="IMG/flower5.jpg">
</li>
<li>
<img src="IMG/flower6.jpg">
</li>
<li>
<img src="IMG/flower2.jpg">
</li>
<li>
<img src="IMG/light1.jpg">
</li>
<li>
<img src="IMG/light3.jpg">
</li>
<li>
<img src="IMG/wood4.jpg">
</li>
<li>
<img src="IMG/bottle.jpg">
</li>
</ul>
</section>
</div>
</div>
</div>
<div class="footer">
<div class="linha">
<footer>
<div class="coluna col12">
<span>Copyright © 2017 - Sentimental Moments Event Decor. All rights reserved.</span>
</div>
</footer>
</div>
</div>
</body>
</html>
OBS: Tudo que está em negrito é o jQuery e o plugin que tem como <div class="cycle-slideshow">