Ir para conteúdo

POWERED BY:

Arquivado

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

Russo4xd

Como carregar extensão jQuery 1.9.1?

Por , em Javascript

Recommended Posts

Russo4xd    2

Russo4xd
Postado

Aí pessoal, gostaria saber como eu carrego a extensão do jquery 1.9.1 no dreamweaver para meu site...

 

Fiz assim:

 

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

 

porém não sei onde devo coloca-lo..

 

ja tentei no header, no body mas o efeito não funciona...

 

http://jsfiddle.net/4Ba4N/

 

Fiz pelo jsfiddle e funcionou, pq esse jquery 1.9.1 é importado de uma forma diferente... Reparem que no lado esquerdo na aba "Frameworks & Extensions" há lá o jQuery 1.9.1 no Onload, aí o script passa a fazer efeito... Como eu faço isso no DreamWeaver? Vlw!!

 

 

PS.: Já reparei que há um link externo no jsfiddle na aba "External Resources", porém com ele, a importação é normal, como essa: ,

 

<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

 

Vlw

Compartilhar este post

Link para o post
Compartilhar em outros sites

Russo4xd    2

Russo4xd
Postado

No head, ou depois do body antes das funções jQuery.

 

Aqui está a head e não funcionou o efeito...

 

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9" />
<title>Union Benefícios</title>
<style type="text/css">
body {
	margin-left: 0px;
	margin-top: 50px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-image:url(imagens/bg.png);
	background-attachment:fixed;
}
</style>
<link href="index.css" rel="stylesheet" type="text/css" />
<link href="orbit.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/slide.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

</head>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Flávio Douglas Nunes    5

Flávio Douglas Nunes
Postado

Você pode carregar ele dentro da tag <head>

 

Para começar a utilizar o jquery você precisa ter certeza que o (Document Object Model) DOM, já está pronto para ser usado, portanto utlize seu código jquery da seguinte forma:

 

$(document).ready(function(){
  //Aqui vai o seu código jquery
});

 

Para mais informações consulte:

http://api.jquery.com/ready/

Compartilhar este post

Link para o post
Compartilhar em outros sites

Russo4xd    2

Russo4xd
Postado

Mais que efeito ?

 

este:

 

http://jsfiddle.net/4Ba4N/

 

Só clicar em "Exibir/Ocultar Notícias"

 

e aí verá

 

Você pode carregar ele dentro da tag <head>

 

Para começar a utilizar o jquery você precisa ter certeza que o (Document Object Model) DOM, já está pronto para ser usado, portanto utlize seu código jquery da seguinte forma:

 

$(document).ready(function(){
  //Aqui vai o seu código jquery
});

 

Para mais informações consulte:

http://api.jquery.com/ready/

 

Na verdade, eu estou achando que só funciona na web... Uso o EasyPHP para emular, e acho que não faz efeito... Ou tem algo errado...

 

Como já disse, se vc entrar nesse link

 

http://jsfiddle.net/4Ba4N/

 

Vai ver o que estou tentando fazer, porém, o estilo de importação de arquivos JS e CSS é diferente do Dreamweaver, e eu percebi que é isso que define o efeito... Vou tentar hospedar o site em algum lugar grátis e ver se funciona...

 

Mas quem conhecer o JSFIDDLE (que é esse serviço de testes) me avisa e diga o que eu deva fazer

Compartilhar este post

Link para o post
Compartilhar em outros sites

Flávio Douglas Nunes    5

Flávio Douglas Nunes
Postado

Russo4xd não tem nada a ver!

Javascript é interpretada e executada pelo navegador, se não está funcionando localmente, tambem não vai funcionar em nenhum outro servidor.

 

Tanto faz se você usa Dreamweaver ou qualquer outro editor,

na importação do JS, não existe segredo é simplesmente:

 

<script type="text/javascript" src="caminho_do_script.js" />

 

Posta seu código aqui que fica mais facil te ajudar!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Russo4xd    2

Russo4xd
Postado

Russo4xd não tem nada a ver!

Javascript é interpretada e executada pelo navegador, se não está funcionando localmente, tambem não vai funcionar em nenhum outro servidor.

 

Tanto faz se você usa Dreamweaver ou qualquer outro editor,

na importação do JS, não existe segredo é simplesmente:

 

<script type="text/javascript" src="caminho_do_script.js" />

 

Posta seu código aqui que fica mais facil te ajudar!

 

 

Bom, o código é esse:

 

HTML

 

<!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>
<style type="text/css">
a {
    color: #000;
    cursor:pointer;
    display:block;
    text-align:center;
    font-family:'Trebuchet MS', arial, san-serif;
}

a:hover {
    color: #F90;
    cursor:pointer;
    display:block;
    text-align:center;
    font-family:'Trebuchet MS', arial, san-serif;
}

#areaNav{
	 position:fixed;
	 float:right;
	 right:0;
	 top:0;
     width: 250px;
     height: 100%;
     background:none;
}

 #userNav {
	 position:fixed;
	 float:right;
	 right:0;
	 top:20px;
	 opacity:0.5;
     width: 250px;
     height: 100%;
     background: #ccc;
  }
</style>
<script type="text/javascript" src="js/slide.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

</head>

<body>

<div id="areaNav">
<a id="loginPanel1">Exibir/Ocultar Notícias</a>
<div id="userNav">
<h3 style=" font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; text-align:center;">Atividades Recentes</h3>
</div>
</div>

</body>
</html>

Slide.js (faz o efeito desejado ao clicar no link Exibir/Ocultar Notícias)

 

$('#loginPanel1').click(function(){
            
                if ($('#userNav').is(':hidden')) {
                   
                   $('#userNav').show('slide',{direction:'right'},1000);
                } else {
                   
                   $('#userNav').hide('slide',{direction:'right'},1000);
                }
});

Compartilhar este post

Link para o post
Compartilhar em outros sites

Russo4xd    2

Russo4xd
Postado

Coloca o jquery antes do slide.js

 

Vlw.. Era exatamente isso... Só não sei por qual motivo isso ocorre... mas pude deduzir que há uma ordem de leitura entre os scripts...

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito