Coisas De Web

Nome:
Local: Rio de Janeiro, RJ, Brazil

Que perguntinha hein?! Mas vamos lá, adoro estudar assuntos relacionados à web, sempre que posso aprendo uma tecnologia, técnica ou linguagem nova. Tento sempre ver quais são as tendências e acompanha-las, enfim eu sou um eterno aprendiz. Deixando o lado profissional, entrando no lado pessoal, sou uma pessoa super gente-boa (pelo menos eu me acho. rs), adoro curtir a night, sair com os amigos, fazer novas amizades e viajar (tem coisa melhor do que isso?) Acho que você já está sabendo demais sobre mim. Fuiii...

domingo, 23 de novembro de 2008

Accordion use a vontade

Accordion é a onda do momento, utilizei alguns, mas os que utilizei não me davam liberdade para customização. Então resolvi fazer o meu accordion que atendessem as minhas necessidades.
Acredito que esteja bem simples de ser utilizado, então coloquei no ar, se alguém precisar já pode utilizar, portanto que deixe os créditos. Críticas e sugestões é só enviar
Para utilizar são necessários as seguintes etapas:

1: Linkar a lib jQuery e o código accordion.
2: Criar o html respeitando algumas seguintes regras.

  • Um elemento global com um id

  • Um elemento com a classe box

  • Dentro do box os seguintes elementos


    • um elemento com a classe header

    • um elemento com a classe content




3: Instanciar o accordion, para instanciá-lo, basta passar um json com as configurações desejadas.
var pars = {
id : 'accordion1',
time : 500,
index : 2,
openIt : function(that){
  //configuração da forma desejada
  $(that).find(".seta img").attr("src", "seta_amarela_cima.png");
},
closeOthers : function(that){
  //configuração da forma desejada
  $(that).find(".seta img").attr("src", "seta_amarela_baixo.png");
}
//id do elemento global (obrigatorio)
// tempo de execução da animação (obrigatorio)
// Se quiser configurar qual item do accordion começará expandido, é só enviar o número. Lembre-se, o indice começa de 0
// Quando elemento expandir, se quiser alguma configuração especial essa é a função, por parâmetro é passado o elemento box
// Quando os elementos fecham, se quiser alguma configuração especial essa é a função, por parâmetro é passado o elemento box

accordion(pars);

No json da passagem do parâmetro apenas dois itens são obrigatórios, o id do accordion e o tempo da animação todos os outros, são de acordo com a sua vontade.

Exemplo de uso:

<div id='accordion'>
  <div class='box'>
    <div class='header'>Titulo do box</div>
    <div class='content'>Conteudo da caixa do accordion</div>
  </div>
  <div class='box'>
    <div class='header'>Titulo do box 2</div>
    <div class='content'>Conteudo da caixa do accordion 2</div>
  </div>
</div>


accordion({id : 'accordion1', time : 500});

O link do código que disponlizei encontra-se aqui

Fuiii...

Marcadores: ,

segunda-feira, 17 de novembro de 2008

JQuery uma ferramenta essencial

Yeah, I'm still alive!

Ultimamente, está faltando disposição para continuar postando, com tantas tarefas, acabo deixando o blog para depois e esse depois nunca chega, um pouco dessa falta de disposição é que estou querendo mudar um pouco, esse negócio de ficar escrevendo sempre, não está mais me satisfazendo, estou procurando uma forma diferente, não sei se entro no mundo dos podcast, videocast, ou seja lá o que for.

Hoje, vou reforçar algo que está mais do que reforçado no mundo dos blogs.JQuery, nunca gostei muito da idéia de usar essas libs, na verdade, não usava, pois queria aprendendo colocando a "mão na massa" sozinho e depois sim, quando me achasse apto, escolher uma dessas bibliotecas-que-fazem-tudo. Enfim, não sei se essa é a melhor maneira de aprender, mas posso dizer que aprendi bastante assim. JQuery, é magnífico vai desde seletores, até pequenas animações que são muito simples de serem usadas. O que mais me conquista nessa lib é a simplicidade, pra mim quanto mais simples melhor e falando em simplicidade não consigo imaginar nada melhor que JQuery.

Aqui vai uma lista de 5 coisas que adoro em JQuery:

atributos do tipo height, que teoricamente, seria necessário duas funções uma de get outra pra set. Utiliza apenas uma função o que define se é set ou get, é a passagem de parâmetro, se passar parâmetro é set, senão é get.

• Os seletores css, por causa deles não sou mais obrigado a colocar id em todos os elementos, é possível encontrar elementos nas páginas de forma fácil e eficiente.

• As funções hover(over, out) e toggle(fn, fn), no primeiro caso, você adiciona o evento de over e out de um elemento de uma forma muito simples e no segundo caso (o qual uso muito), serve para quando um elemento com o evento click possui duas ações diferentes. Por Exemplo, É o caso do interruptor (o botão possui dois estados, ligado e desligado, normalmente)

• E a última, porém não menos importante, são os efeitos que é possível aplicar: show, hide, slideUp, slideDown. Para mim, a melhor é animate. Pois, com essa função você aplica os efeitos que você quiser da forma que quiser, uso muito essa função. Antes, do jquery demorava um pouco, para fazer qualquer tipo de animação, agora não demoro mais do que dois minutos.

Enfim, jQuery para mim é uma biblioteca completa, apesar de muitos não concordarem com isso. A documentação é muito bem explicada, apesar de ser em inglês. E se fosse você e não utiliza jQuery, começaria agora a estudar, muitas empresas, pelo menos aqui no Rio, já estão pedindo conhecimento nessa lib.

Fuiii

Marcadores: ,