Arquivos da categoria "dicas":
27/11/2008 - 22:56
Recentemente, peguei um projeto para desenvolver, onde eu deveria trabalhar com horário. Até ai tudo bem, no entanto eu teria que trabalhar com o horário do servidor, aí veio o problema.
Costumo utilizar um servidor que fica localizado nos Estado Unidos e o Fuso horário diferente. O que fazer?
Uma vez que você aprende é fácil, mas demorei um pouquinho a descobrir.
O PHP tem uma função interna que faz isso pra a gente, só devemos setar o local pra o qual desejamos setar o fuso.
A função é date_default_timezone_set()
Como usá-la?
Basta colocá-la no inicio da página em que você vai trabalhar com horário.
<?php
date_default_timezone_set('Brazil/East');<!–– São Paulo ––>
?>
Mas Garcia, estou trabalhando para uma empresa que fica em Portugal o que fazer?
Simples, altere as propriedades. Aqui tem a lista de todos os fusos.
Veja em funcionamento
Download
Enviado por: Leandro Garcia - Categoria(s): PHP, dicas
Tags relacionadas: dicas, fuso horário, PHP, trabalhando com horas
14/11/2008 - 20:57
Não e sim. Vou explicar.
Não, pois não existe qualquer atributo HTML para a tag que delimite no número máximo de caracteres que um textarea pode ter.
Sim, pois com javascript tem como isso ser feito. Abaixo a função.
function limita(campo){
var tamanho = document.form1[campo].value.length;
var tex=document.form1[campo].value;
if (tamanho>=124) {
document.form1[campo].value=tex.substring(0,124);
}
return true;
}
Essa função conta quantos caracteres tem no textarea e não permite que enhum outro seja inserido.
Linha a linha
function limita(campo){ - Declara a função e receb uma variável com o nome do campo(textarea) em que você quer que a função atue.
var tamanho = document.form1[campo].value.length; - Declara uma variável (tamanho) e insere nela a quantidade de caracteres do textarea.
form1 - O nome do formulário, neste caso está declarado name=”form1″
[campo] - O nome do campo, textarea
value - O conteúdo
length - Quantidade de caracteres
Ou seja, o campo do formulário form1 contém x caracteres.
var tex=document.form1[campo].value - Declara a variável text e recebe o conteúdo do textarea.
if (tamanho>=124) { - Pergunta se a variável tamanho(quantidade de caracteres) é maior que 124
document.form1[campo].value=tex.substring(0,124); - Insere dentro do campo o conteúdo recebido na variável tex com a quantidade máxima de caracteres
substring - Extrai o conteúdo de uma variável, no caso tex, entre os delimitadores, ou seja, do caractere 0 até o 124
Link funcionando
download
Enviado por: Leandro Garcia - Categoria(s): dicas, tutorial
Tags relacionadas: maxlenght, textarea, tutorial
30/10/2008 - 21:01
Resolvi escrever o post anterior, pois percebi que algumas pessoas que estão começando com internet ou programação não sabiam o que era. Meu intuito em principio era falar apenas sobre como trabalhar com querystring no javascript.
Quando trabalhamos apenas com a interface de um projeto, ou com um site sem backend, não temos acesso a linguagens Servidor (ASP, JSP, PHP…). Isso se torna um problemão quando nos pedem que determinada página realiza uma ação, como por exemplo um alert, apartir do clique em uma outra página. Ficou confuso? Vou tentar melhorar.
Uma página, vou chamar de teste, ao ser aberta exibe um texto escrito “teste”, e mais nada. Uma segunda página, chamarei de index, exibe um link direcionado para a página “teste”, mas o projeto requer que após o clique no link, ao acessar a página seja exibido um alert dizendo “trabalhando com querystrings”. Como fazer isso? Com querystrings. Como? Utilize a função abaixo.
function QueryString(variavel){
var variaveis=location.search.replace(/\x3F/,"").replace(/\x2B/g," ").split("&")
var nvar
if(variaveis!=""){
var qs=[ ]
for(var i=0;i<variaveis.length;i++){
nvar=variaveis[i].split("=")
qs[nvar[0]]=unescape(nvar[1])
}
return qs[variavel]
}
return null
}
Explicando linha por linha:
function QueryString(variavel){ - define a função com o nome
var variaveis=location.search.replace(/\x3F/,”").replace(/\x2B/g,” “).split(”&”) - cria uma variável onde são pegadas todos itens da query.
var nvar - caria uma variável
if(variaveis!=”"){ - pergunta se a variável que criamos anteriormente com os itens da query tem conteúdo
var qs=[ ] - Cria uma variável array chamada qs
for(var i=0;i<variaveis.length;i++){ - faz um looping para percorrer todas as variáveis encontradas na query
nvar=variaveis[i].split(”=”) - define o valor da variáve
qs[nvar[0]]=unescape(nvar[1]) - define o valor para cada iten do array } - fecha o loop;
return qs[variavel] - retorna o que encontrou. Agora você tem como pegar os itens da query, mas ainda não está funcionando, pois você precisa chamar esta função de alguma maneira. Vou chamá-la através de uma escrita.
<script>
document.write('A query é:' + QueryString('id') )
</script>
A variável id chamada é a que passamos via barra de endereços. Ex.
www.leandrogarcia.com/tutorials/query/query.html?id=1
Vai ser exibido na tela A query é: 1 Abraços.
Enviado por: Leandro Garcia - Categoria(s): JavaScript, dicas, tutorial
Tags relacionadas: dicas, função, JavaScript
30/10/2008 - 19:57
Quem programa em qualquer linguagem backend para internet (ASP, PHP, Colffusion, ,NET…) conhece o que é uma querystring, mas para quem não conhece vou dar uma pequena explicação:
Querystring é a maneira utilizada para passarmos parametros para outras páginas através da barra de endereços sem a necessidade de um formulário.
Como é usado?
A estrutura é simples e não varia de linguagem para linguagem. Veja:
nomedapagina.html?variavel=conteudo&id=1
nomedapagina.html - é o endereço da página, pode ser qualquer extensão Web, PHP, ASP, ASPX…;
? - Esse é o x. É com o ponto de interrogação (?) que dizemos ao browser, ou às linguagens, que a partir dalí não é mais a página, mas sim uma variável;
variavel - é o nome que você dá, pode ser qualquer coisa. É muito comum utilizar “id” para passar um identificador;
conteudo - o que você quer passar para a outra página
& - outro ponto importante, o & indica ao browser, ou a linguagem, que a partir dalí haverá uma outra variável, ou seja, você pode passar mais do que uma variável por este método.
Um conselho: Evite passar variáveins em demasia desta maneira, pois o usuário consegue ver o conteúdo o que em algumas ocasiões deixa as aplicações mais vulneráveis.
Espero que seja útil.
Enviado por: Leandro Garcia - Categoria(s): JavaScript, dicas
Tags relacionadas: básicos, Praticas
02/10/2008 - 18:01
Eu cheguei a usar essa tabela algumas vezes quando programava para desktop, depois não mais precisei, porém acredito que seja interessante termos em mão caso precisemos.
Segundo o wikipedia
ASCII (acrônimo para American Standard Code for Information Interchange, que em português significa “Código Padrão Americano para o Intercâmbio de Informação”) é uma codificação de caracteres de sete bits baseada no alfabeto inglês. Desenvolvida a partir de 1960, grande parte das codificações de caracteres modernas a herdaram como base.
A codificação define 128 caracteres, preenchendo completamente os sete bits disponíveis. Desses, 33 não são imprimíveis, como caracteres de controle atualmente obsoletos, que afetam o processamento do texto. Exceto pelo caractere de espaço, o restante é composto por caracteres imprimíveis.
Link da tabela
Enviado por: Leandro Garcia - Categoria(s): dicas
Tags relacionadas: tabela ascii
02/10/2008 - 17:44
Vira e mexe alguns de nós, por falta de dinheiro ou por displicência, acabamos atrasando o pagaento de alguma conta.
Tinha que pagar o IPTu de minha casa, me esqueci de pagar a primeira parcela e “temendo” ir ao banco acabei atrasando algumas parcelas. Resolvi pagá-las, mas precisava saber quanto, mais ou menos, eu pagaria de juros para que pudesse sacar do banco. Pensando nisso, acabei criando um script que calcula o valor do juros e da mora.
A primeira versão, faz o cálculo de porcentagem, ou seja, você coloca o valor do boleto o valor em porcentagem da multa, o valor em porcentagem da mora e a data data para pagamento. O script calcula quantos meses está atrasado e a partir daí dá o valor que, provavelmente, você terá que pagar. Eu digo provavelmente, pois não conheço muito bem as nuances dessas coisas.
Se por um acaso vocês acharem que os cálculos estão errados e puderem me dizer o porque, eu fico agradecido, assim posso alterar e deixar bem funcional para que todos possamos usá-lo.
Clique aqui para abrir a calculadora
Enviado por: Leandro Garcia - Categoria(s): JavaScript, dicas
Tags relacionadas: calculadora, JavaScript, juros, mora
24/09/2008 - 23:05
Dando continuidade na redução do peso das páginas, apresento à vocês uma técnica chamada: CSS Sprites!
Mas o que diabos é isso? É um novo refrigerante?
Não, não é refrigenrante é a arte de fazer uma unica requisição de imagem via CSS para diversos itens.
Como assim?
Vamos começar do básico.
Segundo o Wikipedia
Sprites were originally invented as a method of quickly compositing several images together in two-dimensional video games using special hardware. As computer performance improved, this optimization became unnecessary and the term evolved to refer specifically to the two dimensional images themselves that were integrated into a scene. That is, figures generated by either custom hardware or by software alone were all referred to as sprites. As three-dimensional graphics became more prevalent, the term was used to describe a technique whereby flat images are seamlessly integrated into complicated three-dimensional scenes.
Em português
Sprites foram originalmente inventadas como um método de composição rápida de algumas imagens juntas em jogos de video game em 2d usando hardwares especiais. Como forma de otimizar o careggamento dos softwares….
Creio que Já é o sificiente!
Vamos ao que interessa. Os Sprites em CSS
A técnica é simples e você pode utilizar para quase todas as imagens do seu layout, desde que essas imagens não se repitam dentro de um mesmo elemento ou não tenham tamanho definido. Exemplo: em um background de página você não deverá utilizar o Sprites, pois não há um delimitador de altura e largura para a exibição desta imagem.
Vamos a um exemplo prático:
Façamos um menu.
Briefing: Quatro links, cada um com a cor de fundo diferente, cada um deve ter um degradê.
1º Passo: A IMAGEM
2º Passo: O HTML
<ul class=”sprites”>
<li class=”um”><a href=”#”>1</a></li>
<li class=”dois”><a href=”#”>2</a></li>
<li class=”tres”><a href=”#”>3</a></li>
<li class=”quatro”><a href=”#”>4</a></li>
</ul>
3º Passo: O CSS
*{list-style:none}
.sprites li{float:left; text-align:center; width:50px; height:30px; background:url(http://www.leandrogarcia.com/tutorials/images/sprites.jpg) repeat-x}
.sprites li.um{background-position: 0 0}
.sprites li.dois{background-position: -30px 0x}
.sprites li.tres{background-position: 0 -60px}
.sprites li.quatro{background-position: 0 -90px}
.sprites li a{color:#000;font-weight:bold}
Resultado
Assim Conseguimos um layout, onde cada um dos itens do menu tem uma imagem de fundo, mas não precisamos requisitar quatro imagens, apenas uma.
Vantagens?
Entre as vantagens, posso citar:
a facilidade de manutenção, uma vez que haverá menos imagens a alterar;
o menor número de requisições HTTP;
maior velocidade de carregamento, uma vez que haverá menos itens a requisitar.
Pra finalizar
Ao utilizar o sprites, nós possíbilitamos ao usuário uma maior velocidade no carregamento. Uma página carregada mais rápido, deixa o usuário mais feliz, um usuário mais feliz, tende a voltar mais vezes, desde que o conteúdo seja relevante
Veja em funcionamento: link
Download: Sprites
Enviado por: Leandro Garcia - Categoria(s): CSS, Praticas, dicas
Tags relacionadas: boas práticas, CSS, css sprites, redução de peso, redução do tamanho, sprites
10/09/2008 - 19:55
Eu e, acredito que, muitos dos que lerão este post já sofream ou sofrem quando precisam bolar um layout e não sabem quais cores combinam melhor com o que.
Ha algum tempo um designer amigo meu, o Rafael Tatu, me apresentou o ColourLovers!
O que é o Colour Lovers?
O colourLovers é uma comunidade onde Designers e não designers do Mundo todos postam paletas de combinação de cores, além de texturas, que você pode usar em seus layouts. É muito útil, principalmente para os não Designers, como eu!
www.colourlovers.com
Abraços
Enviado por: Leandro Garcia - Categoria(s): Sites que rolam, dicas
Tags relacionadas: color, colour Lovers, cor, dica, lover
27/06/2008 - 23:57
A resposta é:
http://www.websitebullets.com/
Em algum momento de nossos desenvolvimentos nos deparamos com a necessidade de algum bullet.
Aqueles que nunca precisaram dirao: Se eu precisar eu mesmo faço.
Sim, é uma opção, mas às vezes nós precisamos de um bullet e estamos sem tempo, sem criatividade ou até mesmo sem saco para tal. É para esses momentos que eu dou a dica deste site.
Não tenho a menor idéia de quem foi o Gênio que disponibilizou para que qualquer pessoa peque e utilize, mas digo que foi ua boa idéia.
Ainda não precisei usar quelauer um desses bullets, mas presumo que dentro em breve precisarei.
Se você que está lendo precisar, sinta-se à vontade. Não é vergonha alguma utilizar coisas prontas, desde que você tenha licença para isso ou seja de licença free.
Mais uma vez e dessa vez em letras garrafais o site.
Você acho essa dica útil??? Comente… Me diga o que achou, me dê suas dicas, me ajude a melhorar este blog.
Compare preços de livros sobre HTML
Enviado por: Leandro Garcia - Categoria(s): dicas
Tags relacionadas: bullet, dica, free, livre
