Silici0 :: Blog

Muito comum eu ver por ai ou me perguntarem se eu tenho função X em AJAX ou como se faz coisa Y em AJAX, sendo que muitas vezes o X e/ou Y estão longe de ser uma sistemática de AJAX, por isso hoje vou escrever esse texto para finalmente tirar todas dúvidas sobre o que é ou não esse tal de AJAX.

AJAX é a abreviação do Asynchronous Javascript And XML assíncrono de JavaScript e XML (não necessário sendo XML), mas esse assincrono por ae o que é? É a idéia de ‘liberdade’, a base de você fazer uma requisição ao servidor e esperar, porém enquanto você espera você esta livre para fazer outras coisas. Exemplo: Se você requisitar se um usuário é valido ou não você pode enquanto isso, colocar uma img de loading na tela enquanto não vem a ‘reposta’. Assim que a resposta chegar você toma as devidas decisões.

Hmmm… esta començando e entender? Então ja de base nós temos em mente que todo AJAX é um requisição ao servidor, sem tempo de resposta, (geralmente é rápido) e na qual podemos fazer ações enquanto não chega a resposta.

E o XML, seria a idéia de que toda resposta da requisição deveria ter, porém nos podemos trazer tranquilamente respostas em outros formatos conteúdo HTML, documento em XML, simplesmente algum ‘texto’ ou notação de objeto de JavaScript (famoso JSON). Então quando receber essa requisição, trabalhar com esses dados. Todos esses tipos de resposta de requisição referen-se a tecnologia ou método AJAX.

Apartir então da reposta você pode atualizar ou modificar o conteúdo da ‘página’ com o Modelo de Objeto do Documento (famoso DOM).

Com as imagens acima você ver ‘desenhado’ como é a idéia de requisição e resposta, com tudo isso você tem a vantagem de ter páginas mais dinamicas afim de melhorar o desempenho em relação ao usuário. Dúvidas? Sugestões? So comentar.

Show/Hide (Abrir/Fechar) do JQuery para Menus

Vou screver esse tutorial com base no MORE Showing, MORE hiding, do site Learning JQuery, no qual é recomendadissimo a leitura para quem entende de inglês e quer aprender mais sobre Jquery, site cheio de dicas e tutoriais...

Se você está perdido aqui e nunca viu nada sobre Jquery, você pode começar com o tutorial original Traduzido.

Para os elementos do Abrir e Fechar do Menu vamos usar somente HTML e complementos de CSS para ficar 'bonito'.

HTML:

<div class="try">
<h3>Musicas</h3>
<div>
<span class="interno">Offscpring </span>
<span class="interno">Insonic </span>
<span class="interno">Killer Buds </span>
<span class="interno">DJ SKILLO </span>
<span class="interno">DJ PASSA MAL </span>
<span class="interno">DJ silici0 </span></div>
<h3>Videos</h3>
<div>
<span class="interno">Malabares </span>
<span class="interno">Clips</span>
<span class="interno">Musica</span>
<span class="interno">Filmes</span></div>
<h3>XXX</h3>
<div>
<span class="interno">Blonde</span>
<span class="interno">Branca</span>
<span class="interno">Verde</span>
<span class="interno">Amarelo</span></div>
</div>

CSS:

body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
.try{
font-style:normal;
font-family:Arial;
font-size:14px;
padding-left:20px;
}
.try h3 {
margin: 0;
padding: .25em;
background: #99FFCC;
border-top: 1px solid #999966;
border-bottom: 1px solid #999966;
}
.interno{
margin: 0;
padding: .25em;
padding-left:15px;
}

Essa opção permite que cada sessão possa ser aberta e fechada independente de outras. Esse é o modo mais fácil de fazer o menu de árvore.

O método que iremos usar é .slidetoggle(), é um elemento que escorrega para baixo o menu quando for abrir e escorrega para cima quando for fechar.

Primeiramente vamos esconder todos itens do sub-menu e também vamos conectar cada click para cada h3.

JAVASCRIPT:

$(document).ready(function() {
$('div.try:eq(0)> div').hide();
$('div.try:eq(0)> h3').click(function() {
});
});

Usamos :eq() que é um seletor que passa por todos DIV e H3, dando HIDE e então criando opção do click.

Então colocaremos o método .slidetoggle() dentro do método click. Como sabemos que cada DIV que queremos mudar a opção para Mostrar/Esconder é a próxima tag de cada H3, podemos usar o metodo .next():

JAVASCRIPT:

$(document).ready(function() {
$('div.try:eq(0)> div').hide();
$('div.try:eq(0)> h3').click(function() {
$(this).next().slideToggle('fast');
});
});

Nesta ultima linha que adicionamos nos dizemos que para o H3 clicado nos referimos o metodo .slidetoggle() para a próxima TAG.

Supersimples não é mesmo? Você pode ver o código de outros modos nesse exemple que eu fiz: Exemplo. Dúvidas? Sugestões? So comentar... abraços

Como é a sua área de trabalho?

Pelo que eu entendi... a brincadeira começou no blog do 1001 gatos, chegou no blog do Aguinelo Pedroso e agora esta aqui... muito interessante ver áreas de trabalho... hehe estou mostrando a do meu trabalho, ja que passo maior parte do tempo aqui.

Minha organização é a desorganização, não liga não... façam seu trackback para cá e mostre sua área de trabalho também...

Esse monte de coisas ai jogadas, na verdade são arquivos temporarios que jogo e não limpo, geralmente quando não da mais para usar eu dou uma limpada afim de melhorar o visual, eu uso wallpaper, porém hoje em questão não tem nenhum...

Contrata-se

Com o crescimento da empresa é inevitável novos colaboradores para ajudar-nos na nossa jornada. Por isso venho aqui através do meu blog, informar a todos os 'ouvintes' que minha empresa Super Gestão, abriu 2 vagas fresquinhas para estagiários, uma para programação PHP e outra em WebDesign ...

Afim de satisfazer novos projetos "montros" que tem aparecido, assim como atualização, melhoramento de outros... e olha trabalho é o que não vai faltar viu... hehehe. Mas vamos ao que interessa, até aqui as perguntas que devem passar na cabecinha de vocês será! Será que eu me encaixo? Saberemos pelo requisitos:

Bom, é muito? Não atingiu todos requisitos ? Falta muito? Não tem problema, envie mesmo assim seu CV para que possamos guarda-lo com carinho e entrar em contato outra hora, nunca se sabe quando precisaremos do seu serviço... =)

Avisando que todos os Curriculos serão analizados com direito a resposta (hehe!), todos devem conter o seguinte, isso é de bom gênero afim de agilizar todo o processo, Curriculos em ANEXO formato do WORD, pretensão salarial, portfólio (isso é importante, nem que seja aquele site horrivel com xhtml bonito)... é bom lembrar essas coisas que não muito raramente recebemos CV com nada, ou faltando pedaços, enfim, prestem atenção.

A dúvida gerada até aqui! Para onde envio o CV ? Mandar para rafael.cunha@supergestao.com.br

Barra Web Developer

Como é comum eu apresentar essa maravilhosa barra do firefox o tempo todo para pessoas, eu venho através do meu blog, apresenta-la também... =)

A Web Developer BAR é uma barra feita para Firefox, Flock, Mozilla e Seamonkey, afim de ajudar os desenvolvedores de WEB a acharem novos problemas, indeficarem erros, melhorias, usabilidade entre outros... sem essa barra eu dificilmente conseguiria progredir tanto em CSS como eu progredi.

Existem muitas propriedades, não vou falar de todas elas, pois são muitas mesmo, vou falar uma das que mais uso...

Information > Div Order
Mostra as posições das DIV´s e ordem que estão sendo criadas... Veja imagem abaixo:

Entre outras que não irei listar aqui... ver com um click todo JS da página, ver todo o CSS, indentificar erros e warnings de JavaScript no site... ver disposição de tabelas, verificação em tamanhos de janelas, ver imagens, informações dos forms, cookies e assim vai...

Ganhando dinheiro com clicks

Eu estou pesquisando sobre como ganhar dinheiro na internet faz um tempo, visto sistes de afiliados, sites de ads, sites de cliks, leitura de e-mails, sites e muito outros que prometem uma renda fazendo muito pouco. Visto que maioria dos blogs, sites, vendem publicidade, troca de banners, são afiliados a sistemas como buscape, jacotei, submarino, mercadolivre e muitos outros. O que me chamou atenção conversando com amigos pela internet e pesquisando são idéias de sites que vendem pageview e pagam para pessoas acessarem.

Existem muito desses sites, mas me pareçe que um americano em questão tem despertado muito interesse dos brasileiros o AdBux, que no caso realmente paga em Dolares $0.01 para cada site que você visitar e $0.01 para cada site que uma indicação sua visitar.

Baseados nessa conta se você clicar em 10 sites por dia você ganha $ 0.10 cents de dolares.
Se 10 indicações clicarem em 10 sites por dia você ganha $ 1.00 dolar.
Isso são $ 7.70 dolares por semana e $ 30.80 dolares por mês.

Claro que existem outros modos de aprimoramento desse ganho, com conta GOLD (ouro) elém de compras de referências e outros bonus.
Mas como eles pagam? Via conta paypal, que é o BRpay brasileiro, muito seguro para compras e vendas nos EUA, pessoal mundo a fora tem essa conta PayPal, para cria-la click aqui. Para saber como cria-la, veja um texto sobre no revolução.
Estou tão seguro de que eles pagam, que criei minha conta paypal ontem, você so deve ter um cartão de crédito e inicialmente pagar $1.95 dolares para criar a conta paypal que será convertida em $ 1.95 de crédito depois, seu dinheiro volta para você.

Eu irei aqui falar sobre o AdBux assim que forem ocorrendo meus ganhos, provarei com o extrato do paypal que realmente vale a pena e funciona. Mas cuidado, ja percebi que é meio viciante a brincadeira de ganhar dinheiro, hehehe. Logo então não se cadastre em todos sites que prometam isso, pois alguns, sua grande maioria não paga.

CLICK AQUI para criar sua conta AdBux. Dúvidas? É so comenta-las que elas serão respondidas aqui mesmo nos comentários, ou e-mail-me em silici0@gmail.com