Olhada rápida no JQuery.
August 18, 2008 at 6:13 pm | In JQuery | Leave a CommentO que é JQuery ?
Jquery é uma biblioteca JavaScript rápida e concisa que simplifica o modo como você prepara seus documentos HTML, manipula eventos, executa animações e interações Ajax em suas páginas. Jquery destina-se a mudar a maneira que você escreve JavaScript. (tradução livre do site oficial).
O que você precisa saber?
O básico de JavaScript, HTML, e DOM, caso você não saiba nada sobre isso e queira seguir esse pequeno post recomendo os seguintes links:
O que É:
* O que é HTML.
* O que é JavaScript.
* O que é DOM. (Document Object Model – Modelo de Objetos de Documentos).
Um pouco sobre:
* HTML (em inglês).
* JavaScript (em inglês).
* DOM (em inglês).
Download da biblioteca:
Para demostrar alguma coisa do JQuery já funcioando crie uma página simples em html algo com:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
window.onload = function()
{
altet(“Alguma coisa aqui”);
}
</script>
</head>
<body>
<a href="http://google.com"> Google Page </a>
</body>
</html>
Você pode ter sua cópia do Jquery em outro diretório que não seja o mesmo em que está o html então se for seu caso simplesmente lembre-se de mudar o atributo src e indicar o local onde sua cópia esta.
Aqui como serão exemplos pequenos exemplos iremos incluir o código Jquery no mesmo documento html, obviamente você pode criar um link para um arquivo .js separado, assim:
<script type="text/javascript" src="meujs.js"></script>
mas aqui iremos colocar tudo no mesmo documento.
Algo que geralmente se faz é uma simples janelinha de alerta quando você acessa uma página, em JavaScript normal geralmente usamos o evento window.onload da seguinte forma:
<html>
<head>
<!-- ainda nao precisamos dessa linha de baixo -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
window.onload = function()
{
altet(“Alguma coisa aqui”);
}
</script>
</head>
<body>
<a href="http://google.com"> Google Page </a>
</body>
</html>
Rode ou atualize a página e você vai ver o fabuloso alerta aparecer, bom isso funciona, mas tem um porém, esse código JavaScript só será executado após todas imagens e outros elementos serem carregadas, mas o Jquery tem um evento para concertar isso.
O Jquery tem um declaração que “espera” a página estar “pronta” ( ready ), pois praticamente tudo o que se faz com Jquery é a manipulacão DOM (Document Object Model – Modelo de Objetos de Documentos).
Antes de começarmos a manipular o DOM ele tem que estar caregado, assim:
$(document).ready(function(){
// Código Aqui
})
Uma coisa que eu devia ter escrito no começo desse post mas deixei par escrever agora, é sobre o $, o $ é digamos assim um alias (atalho) para a classe Jquery e o $( ) construe um novo objeto jQuery , e por exemplo $(“a”) é um seletor que era selecionar todos os elementos a, um exemplo:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("div.mouseover").mouseover(function(){
$("p").text("Mouse em Cima");
}).mouseout(function(){
$("p").text("Mouse Fora");
});
})
</script>
</head>
<body>
<div class="mouseover">
Passe o Mouse Aqui</div>
</body>
</html>
Explicando o exemplo acima: começamos fazendo a declaração do ready normalmente para podermos manipular os elementos DOM, usamos o seletor $(“ “) para dizer que será aplicada a div chamada mouseover, usamos então o event mouseover( ocorre quando se passa o mouse em cima do elemento), usamos novamente o seletor dizendo que irá mudar o conteúdo da tag p, e logo abaixo declaramos o event mouseout (mouse fora).
Se nessa mesma página tivermos outras tag dentro da div mouseover o mesmo efeito iria aparecer para elas todos, como dito acima é isso que o seletor $(“ ” ) faz.
Mesmo você tendo outras tag p que não estejam dentro da div mouseover estas irão ter o mesmo efeito, então para o local onde você queira o efeito difina algo do tipo:
<p class=”mudar’> Alguma coisa </p>
e claro no código mude para
$("p.mudar").text("Mouse em Cima");
Agora um exemplo usando o evento click, quando clicamos em algum elemento.
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert("Hello JQuery");
}) ;
})
</script>
</head>
<body>
<button> Click me </button>
</body>
</html>
Pode-se notar uma coisa que você pode querer aplicar, por exemplo, o evento click em mais de um elemento button, para isso você não precisa escrever novamente o javascript, eu posso ter 10 botões que devem ter um alert quando clicados e não tenho que escrever mais nada, pois como viemos termos o seletor $(“ ”) .
Bom isso foi apenas uma olhada rápida no Jquery ele tem muitas coisas a mais que podem fazer seu trabalho com JavaScript ficar menor, mas com esse pequeno exemplo já pode-se notar que fica calro a diferença entre escrever javascript normal e usando essa biblioteca.
Estarei postando algumas coisas a mais sobre Jquery em breve.
Qual Linux Funciona(100%) no Acer 5050?
August 10, 2008 at 5:23 pm | In LInux | 3 Comments
Bom tava vendo no meu wordpress que alguem acabou caindo no meu blog pesquisando por “Qual linux funciona no Acer?”, boa porgunta, afinal qual Linux funciona nos Acer, mais precisamente no Acer 5050, bom é sobre isso que vou escrever nesse post, um pouco da minha experiência com o Pinguim e com o Acer 5050.
Bom, testei uma porção de distros Linux no Acer 5050, algumas delas: Mandriva, Ubuntu 8.10, OpenSuse 10 e 11, Mint 5. . . e algumas mais, essas não funcionaram a rede então nem testei as outras coisas(o que se faz sem rede?), realmente não sei porque não funciona a rede no Ubuntu 8.10 e afins, pois nas versoes anteriores funciona, atualmente estou usando o Mint 4 que foi a distro que mais funcionou no Acer 5050, e mesmo assim ainda não consegui fazer funcionar a Wireless e nem o monitor de bateria , segundo sei os acer tem um serio problema com ACPI que me parece que não segue muito alguns padroes e acaba por funciona 100% somente em Windows(salve Bill), mas mesmo assim, tenho rede funcionando e com isso posso fazer tudo o que desejo exceto Wireless e monitor de bateria, estou praticamente preso do Mint 4, não podendo utilizar outra distro.
Problemas com ACPI acer podem(não sei mesmo) ser resolvidos fazendo umas manobras um pouco complicadas como “arrumar” os possiveis erros da ACPI do Linux no qual segundo vi ninguem conseguiu ate hoje mesmo tendo varias receitas de bolo na Web.
Estou aguardando a versao nova no Ubuntu que espero que esteja por funcionar 100% nos acer, mesmo que não tenho tanta fé nisso, mas funcionando a rede já estária de grande tamanho.Então é isso não foi um relato detalhado sobre minhas decepsões com as distro + acer, mas não tem muito o que se falar mesmo, caso alguem leia esse post e tenha a solução para alguns desses problemas citados aqui faça o favor de deiar um comentário com a solução que será de grande ajuda.
[NOTA] Este Blog NÃO está morto!
August 2, 2008 at 1:57 pm | In Geral | Leave a Comment
Bom já, fazia algum tempo que eu não postava nada aqui no blog, basicamente a razão para essa falta de post aqui é porque realmente não encontrei nada que achei util de se escrever (não que o que já tenha aqui seja útil), então falando sem muita enrolação isso aqui NÃO é um POST e sim uma NOTA na qual escrevo que este blog NÃO morreu e que irá ter outros posts assim que possivel.
Obrigado.
Blog at WordPress.com. | Theme: Pool by Borja Fernandez.
Entries and comments feeds.
