Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Não entendo muito, mas tentei resolver e não consegui.
O slider de fotos não está mais funcionando (Botões e nem o modo "Swiper").
Alguém pode me ajudar, por gentileza?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>MODAL SWIPER</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/swiper.min.css">
<link rel="stylesheet" href="css/swiper2.css">
<link rel="stylesheet" href="css/bootstrap.min.css"">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-XdYbMnZ/QjLh6iI4ogqCTaIjrFk87ip+ekIjefZch0Y+PvJ8CDYtEs1ipDmPorQ+" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<div class="wrapper">
<a class="sm_open" data-modal="examplePlain" data-effect="pushdown">BOTÃO</a></li>
</div>
<div class="slim_modal" id="examplePlain">
<div class="sm_content">
<div class="sm_content_inner_wrap">
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="swiper-zoom-container">
<img src="1.jpg">
</div>
</div>
<div class="swiper-slide">
<div class="swiper-zoom-container">
<img src="2.jpg">
</div>
</div>
<div class="swiper-slide">
<div class="swiper-zoom-container">
<img src="3.jpg">
</div>
</div>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination swiper-pagination-white"></div>
<!-- Add Navigation -->
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<a class="sm_close sm_close_button">CLOSE</a>
</div>
</div>
</div>
<script src="js/index.js"></script>
<!-- Swiper JS -->
<script src="js/swiper.min.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- Initialize Swiper -->
<script>
var swiper = new Swiper('.swiper-container', {
zoom: true,
pagination: {
el: '.swiper-pagination',
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
</script>
</body>
</html>você tá importando o jQuery duas vezes. Deixe apenas uma.
As vezes não funciona por causa de conflito de arquivos JS que possuem as mesmas formatações nas tags.
Tente ver no debug que mensagem está dando... e tente alterar as posições das declarações.