Ir para conteúdo
aqiluciano

Botões e Swiper de slider não funcionam

Recommended Posts

 

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>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

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.

Compartilhar este post


Link para o post
Compartilhar em outros sites

você tá importando o jQuery duas vezes. Deixe apenas uma.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por rhuan martins
      Olá, estou começando nesse mundo de programadores e desenvolvedores e queria saber se quando eu estiver escrevendo o código fonte no html e escrever um tag, vou poder utilizar o selfclose em todas ou só conseguirei utilizar em algumas como <meta charset ="utf-8" />?
    • Por Zaira67
      Eu tenho uma tabela em html, a primeira coluna foi preenchida manualmente, as colunas são preenchidas dinamicamente com JavaScript. Quando eu preenche as outras colunas da tabela, aquelas que são preenchidas dinamicamente, os valores aparecem na primeira coluna que é preenchida manualmente. como eu posso corrigir isso
      Aqui está o script
       
      var index = 0; var myTable= document.getElementById('table'); var tBody = myTable.tBodies[0]; var indicatorIdList = main_indicator.metaData.dimensions.dx; var orgUnitList = main_indicator.metaData.dimensions.ou; var items = main_indicator.rows; for(i in orgUnitList){ for(j in indicatorIdList){ for(k in items){ var dataIndicator = items[k]; if(orgUnitList[i]== dataIndicator[1] && indicatorIdList[j]==dataIndicator[0]){ tBody.rows[j].cells[i].innerHTML = dataIndicator[3]; } } } } Note: main_indicator e' a requisicao buscada numa api
    • Por BryanSamuel
      Eu preciso somar a coluna SOMA onde a coluna A e a coluna B(ao outro registro, por exemplo A do registro 1 e A do registro 2 forem iguais) forem iguais, após isso dividir por 3 e em seguida inserir em outra tabela.
    • Por clickanapolis
      Bom dia.
      Eu estou na fase de entrega de um projeto e estou com uma dificuldade.
       
      Tenha na primeira linha da minha table onde trago todas as etapas, que hoje são 24 e coloquei essa table dentro de um iframe.
       
      Na primeira coluna tenho as datas.
       
      eu preciso que a primeira linha e a primeira coluna seja bloqueada para a pessoa ter um norte de onde ele esta, pois da maneira que fiz ele some e a pessoal não sabe qual processo e qual data ele esta olhando a produção.
       
      Como me auxiliariam a fazer?
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.