0

Bom dia estou iniciando um site e coloquei o bootstrap - coloquei o jquery mais atualizado que tem que no caso é 3.1.1

No inspecte de element ele me apresenta um erro... fui vizualizar e a mesagem é assim : Uncaught Error: Bootstrap's JavaScript requires jQuery resumindo é preciso ter o jquery necessario para que o bootstrap funcione... só que esse jquery atualizado era para funcionar e não sei o por que está dando esse erro

Detalhe o meu menu que tem no site não esta funcionando quando visualizo no emulador de celular que tem no inspecte de element do chrome e de outros browser

Parece que não esta pegando plugins necessário para o mobile. Alguém consegue me ajudar?

Código:

 <head>
        <meta charset="utf-8">
        <meta name="description" content="Studio 7 Hair é um salão de beleza">
        <meta name="author" content="Miyomic">

        <title>Studio 7 Hair</title>

      <link rel="stylesheet" type="text/css" href="css/visual.css">

      <!-- responsivo -->
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

      <link href="css/bootstrap.min.css" rel="stylesheet">

      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

      <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <!-- Include all compiled plugins (below), or include individual files as needed -->
      <script src="js/bootstrap.min.js"></script>
      <script src="js/jqueryAtualizado.js"></script>
      <script src="js/jqueryAtualizado.min.js"></script>
      <script src="js/jquery-3.1.1.slim.min.js"></script>
      <script src="js/modernizr-2.6.2.min.js"></script>
      <script src="js/jquery-1.11.0.min.js"></script>
      <script src="js/jquery.nav.js"></script>
      <script src="js/jquery.parallax-1.1.3.js"></script>
      <!-- Fim responsivo -->

      <script src="js/digitar-home.js"></script>


    </head>
7
  • 1
    Você importou o jQuery antes do Bootstrap?
    – BrTkCa
    Commented 2/12/2016 às 13:05
  • Posta o código onde você importa os scripts mas quase 99% certeza que é o que o @LucasCosta falou ;)
    – leofontes
    Commented 2/12/2016 às 13:06
  • está chamando o bootstrap primeiro e em seguida está chamando o jquery
    – Nathan
    Commented 2/12/2016 às 13:06
  • Inverte a ordem que deve funcionar @Nathan. Coloca primeiro do jQuery após do Bootstrap.
    – BrTkCa
    Commented 2/12/2016 às 13:07
  • Vocé tá chamando várias vezes o bootstrap e o jquery, algum motivo em especial?
    – leofontes
    Commented 2/12/2016 às 13:08

1 Resposta 1

2

O jQuery deve ser importado antes do Bootstrap, esse pode ser uma causa de erro no seu caso. Como o @leofontes mencionou, aparentemente você está importando mais de uma vez o jQuery - essa não é uma boa prática. Seu head deve ficar mais ou menos dessa forma:

      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
      <script src="js/modernizr-2.6.2.min.js"></script>
      <script src="js/jquery.nav.js"></script>
      <script src="js/jquery.parallax-1.1.3.js"></script>

Inclua isso no seu head para funcionar o menu para mobile:

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

Sem eles, a terceira guerra mundial pode começar em qualquer momento.

4
  • Amigo e por que quando vou visualizar o site no emulador mobile do chrome ele não me o menu como deveria aparecer e algo do script certo? porque quando vou diminuido a tela ele mostra o menu.. já no emulador não
    – Nathan
    Commented 2/12/2016 às 13:14
  • Aparentemente está faltando algumas metas tags no seu head, atualizei a resposta.
    – BrTkCa
    Commented 2/12/2016 às 13:19
  • Obrigado... mas o que seria essas tag, é do bootstrap?
    – Nathan
    Commented 2/12/2016 às 13:19
  • Na verdade é do HTML5
    – BrTkCa
    Commented 2/12/2016 às 13:21

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .