Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Maccarv

Não consigo linkar arquivo js na página

Recommended Posts

Bom dia, amigos.

Estou com um probleminha, e gostaria de pedir a ajuda de vocês. Entrei um site que dá exemplos de menus dropdown responsivos, porém, mesmo com os códigos liberados pra gente poder usar, não estou conseguindo fazer funcionar o javascript. Consegui fazer o link para o arquivo css sem problemas, mas quando faço o link para o arquivo javascript, não funciona. Será que tenho que colocar algum nome específico no arquivo?
Vou disponibilizar o link da página que tem o código original. Lá tem os 3 arquivos: HTML, CSS e JS:
https://www.smartmenus.org/about/themes/#demos-gallery
 

Se alguém puder me dar essa força, agradeço muito.

Forte abraço a todos.

Marco Carvalho

Compartilhar este post


Link para o post
Compartilhar em outros sites

@Maccarv repare que a requisição está sendo bloqueada por não conter SSL. 

 

Clique em 'Edit in JSFiddle' e veja o menu funcionando normalmente.

req_block.png

Compartilhar este post


Link para o post
Compartilhar em outros sites

Boa tarde, Jorge.
Muito obrigado pela atenção.

Só uma pergunta: nesse caso então, só com os 3 códigos disponibilizados (html, css e js) eu não vou conseguir fazer ele funcionar de forma alguma? É isso?
Obrigado!

Compartilhar este post


Link para o post
Compartilhar em outros sites
5 minutos atrás, Maccarv disse:

Boa tarde, Jorge.
Muito obrigado pela atenção.

Só uma pergunta: nesse caso então, só com os 3 códigos disponibilizados (html, css e js) eu não vou conseguir fazer ele funcionar de forma alguma? É isso?
Obrigado!

Acesse e veja o código em ação:

https://jsfiddle.net/vadikom/oxe40pat/?utm_source=website&utm_medium=embed&utm_campaign=oxe40pat

 

Se tiver algum problema, informe!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Sim. Mas pra funcionar, não é só eu criar os 3 arquivos (html, css e js), com seus respectivos códigos, e fazer o link no html para o css (esse funcionou) e para js (esse que não funcionou)?
Ou precisa de algo mais para funcionar?
Desde já, te agradeço novamente pela atenção e lhe peço desculpas pelo incômodo e falta de conhecimento.

Compartilhar este post


Link para o post
Compartilhar em outros sites
1 minuto atrás, Maccarv disse:

Sim. Mas pra funcionar, não é só eu criar os 3 arquivos (html, css e js), com seus respectivos códigos, e fazer o link no html para o css (esse funcionou) e para js (esse que não funcionou)?
Ou precisa de algo mais para funcionar?
Desde já, te agradeço novamente pela atenção e lhe peço desculpas pelo incômodo e falta de conhecimento.

Verifique se no arquivo que você está criando, você está colocando o script do jquery no documento html. Se possível, acesse a página que está testando, abra o prompt de comando e veja se há algum erro.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu coloquei isso aqui no cabeçalho:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/comportamento.js"></script>
</head>

<body>
<nav class="main-nav" role="navigation"> ........

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
1 minuto atrás, Maccarv disse:

Eu coloquei isso aqui no cabeçalho:

 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/comportamento.js"></script>
</head>

<body>
<nav class="main-nav" role="navigation"> ........

 

Adicione o link a seguir antes do fechamento da tag body :

<script src="http://code.jquery.com/jquery-3.3.1.slim.min.js"></script>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu criei um arquivo html (header.html), um arquivo css (estilo.css) e um arquivo javascript (comportamento.js). E no header.html, fiz o que postei pra você.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Jorge, fiz o que você me indicou, mas não deu certo ainda.
Se não se incomodar, vou colocar o código inteiro.
 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/comportamento.js"></script>
</head>

<body>
<nav class="main-nav" role="navigation">

  <!-- Mobile menu toggle button (hamburger/x icon) -->
  <input id="main-menu-state" type="checkbox" />
  <label class="main-menu-btn" for="main-menu-state">
    <span class="main-menu-btn-icon"></span> Toggle main menu visibility
  </label>

  <h2 class="nav-brand"><a href="#">Marco Carvalho</a></h2>

  <!-- Sample menu definition -->
  <ul id="main-menu" class="sm sm-blue">
    <li><a href="http://www.smartmenus.org/">Home</a></li>
    <li><a href="http://www.smartmenus.org/about/">About</a>
      <ul>
        <li><a href="http://www.smartmenus.org/about/introduction-to-smartmenus-jquery/">Introduction to SmartMenus jQuery</a></li>
        <li><a href="http://www.smartmenus.org/about/themes/">Demos + themes</a></li>
        <li><a href="http://vadikom.com/about/#vasil-dinkov">The author</a></li>
        <li><a href="http://www.smartmenus.org/about/vadikom/">The company</a>
          <ul>
            <li><a href="http://vadikom.com/about/">About Vadikom</a></li>
            <li><a href="http://vadikom.com/projects/">Projects</a></li>
            <li><a href="http://vadikom.com/services/">Services</a></li>
            <li><a href="http://www.smartmenus.org/about/vadikom/privacy-policy/">Privacy policy</a></li>
          </ul>
        </li>
      </ul>
    </li>
    <li><a href="http://www.smartmenus.org/download/">Download</a></li>
    <li><a href="http://www.smartmenus.org/support/">Support</a>
      <ul>
        <li><a href="http://www.smartmenus.org/support/premium-support/">Premium support</a></li>
        <li><a href="http://www.smartmenus.org/support/forums/">Forums</a></li>
      </ul>
    </li>
    <li><a href="http://www.smartmenus.org/docs/">Docs</a></li>
    <li><a href="#">Sub test</a>
      <ul>
        <li><a href="#">Dummy item</a></li>
        <li><a href="#">Dummy item</a></li>
        <li><a href="#" class="disabled">Disabled menu item</a></li>
        <li><a href="#">Dummy item</a></li>
        <li><a href="#">more...</a>
          <ul>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">more...</a>
              <ul>
                <li><a href="#">Dummy item</a></li>
                <li><a href="#" class="current">A 'current' class item</a></li>
                <li><a href="#">Dummy item</a></li>
                <li><a href="#">more...</a>
                  <ul>
                    <li><a href="#">subMenusMinWidth</a></li>
                    <li><a href="#">10em</a></li>
                    <li><a href="#">forced.</a></li>
                  </ul>
                </li>
                <li><a href="#">Dummy item</a></li>
                <li><a href="#">Dummy item</a></li>
              </ul>
            </li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
          </ul>
        </li>
      </ul>
    </li>
    <li><a href="http://www.smartmenus.org/contact/">Contact</a></li>
  </ul>
</nav>

<div class="demo-text">
  <p>Demonstrates a complete navbar including a mobile view menu toggle button (<a href="http://www.smartmenus.org/docs/#menu-toggle-button">related docs</a>).</p>
</div>

<script src="http://code.jquery.com/jquery-3.3.1.slim.min.js"></script>

</body>
</html>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
1 minuto atrás, Maccarv disse:

Jorge, fiz o que você me indicou, mas não deu certo ainda.
Se não se incomodar, vou colocar o código inteiro.
 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/estilo.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/comportamento.js"></script>
</head>

<body>
<nav class="main-nav" role="navigation">

  <!-- Mobile menu toggle button (hamburger/x icon) -->
  <input id="main-menu-state" type="checkbox" />
  <label class="main-menu-btn" for="main-menu-state">
    <span class="main-menu-btn-icon"></span> Toggle main menu visibility
  </label>

  <h2 class="nav-brand"><a href="#">Marco Carvalho</a></h2>

  <!-- Sample menu definition -->
  <ul id="main-menu" class="sm sm-blue">
    <li><a href="http://www.smartmenus.org/">Home</a></li>
    <li><a href="http://www.smartmenus.org/about/">About</a>
      <ul>
        <li><a href="http://www.smartmenus.org/about/introduction-to-smartmenus-jquery/">Introduction to SmartMenus jQuery</a></li>
        <li><a href="http://www.smartmenus.org/about/themes/">Demos + themes</a></li>
        <li><a href="http://vadikom.com/about/#vasil-dinkov">The author</a></li>
        <li><a href="http://www.smartmenus.org/about/vadikom/">The company</a>
          <ul>
            <li><a href="http://vadikom.com/about/">About Vadikom</a></li>
            <li><a href="http://vadikom.com/projects/">Projects</a></li>
            <li><a href="http://vadikom.com/services/">Services</a></li>
            <li><a href="http://www.smartmenus.org/about/vadikom/privacy-policy/">Privacy policy</a></li>
          </ul>
        </li>
      </ul>
    </li>
    <li><a href="http://www.smartmenus.org/download/">Download</a></li>
    <li><a href="http://www.smartmenus.org/support/">Support</a>
      <ul>
        <li><a href="http://www.smartmenus.org/support/premium-support/">Premium support</a></li>
        <li><a href="http://www.smartmenus.org/support/forums/">Forums</a></li>
      </ul>
    </li>
    <li><a href="http://www.smartmenus.org/docs/">Docs</a></li>
    <li><a href="#">Sub test</a>
      <ul>
        <li><a href="#">Dummy item</a></li>
        <li><a href="#">Dummy item</a></li>
        <li><a href="#" class="disabled">Disabled menu item</a></li>
        <li><a href="#">Dummy item</a></li>
        <li><a href="#">more...</a>
          <ul>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">more...</a>
              <ul>
                <li><a href="#">Dummy item</a></li>
                <li><a href="#" class="current">A 'current' class item</a></li>
                <li><a href="#">Dummy item</a></li>
                <li><a href="#">more...</a>
                  <ul>
                    <li><a href="#">subMenusMinWidth</a></li>
                    <li><a href="#">10em</a></li>
                    <li><a href="#">forced.</a></li>
                  </ul>
                </li>
                <li><a href="#">Dummy item</a></li>
                <li><a href="#">Dummy item</a></li>
              </ul>
            </li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">A pretty long text to test the default subMenusMaxWidth:20em setting for the sub menus</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
            <li><a href="#">Dummy item</a></li>
          </ul>
        </li>
      </ul>
    </li>
    <li><a href="http://www.smartmenus.org/contact/">Contact</a></li>
  </ul>
</nav>

<div class="demo-text">
  <p>Demonstrates a complete navbar including a mobile view menu toggle button (<a href="http://www.smartmenus.org/docs/#menu-toggle-button">related docs</a>).</p>
</div>

<script src="http://code.jquery.com/jquery-3.3.1.slim.min.js"></script>

</body>
</html>

 

E os arquivos CSS e JS que está usando? Cole o código que você está usando (CSS/JS/HTML) no site https://jsfiddle.net/ , clique em salvar e me passe o link.

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por zetabyte00
      Tem alguma diferença de desempenho entre linkar e exportar uma folha de estilo CSS?
       
       
       
       
    • Por lpgrafites
      Olá pessoal, é um pouco ignorante minha dúvida.

      Por não encontrar uma galeria 'boa' em somente php, então preferi apenas exibir as imagens da pasta.

      Esse código exibe as imagens da minha pasta, porém não sei colocar link nelas, para as pessoas clicarem e ela abrir maior.
      Entendo a necessidade de thumbs, ou coloco um código css para exibirem menores que o original(acredito que dê certo).


      <?php


      $files = glob("fotos_galeria/*.png*");
      for ($i=1; $i<count($files); $i++) {
      $num = $files[$i];

      echo ' <li--><img alt="random image" src="'.$num.'" />';

      }

      ?>

      Obrigado.
×

Informação importante

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