Centralizar imagem na vertical com JavaScript

Postado por: Pedro Rogério em
  • 8 mar
  • 3

No post anterior mostrei como é possível centralizar uma imagem na horizontal e vertical com CSS, independente do tamanho da imagem. A solução utilizava algumas propriedades CSS e uma tag <span> vazia no HTML. Para os semanticistas de plantão isso é um crime.

O que podemos fazer então, criar aquela tag <span> via JavaScript, ou então utilizar uma solução com a utilização de jQuery e o resultado final obtido será o mesmo. Primeiro, vamos a marcação HTML, observe que remove a tag span do código utilizada no exemplo anterior e adicionei uma classe a imagem só para identificação no JavaScript:

<div class="box">
    <img class="centralized" src="img1.jpg" alt="" title="" />
</div>

Continuar lendo »

Central Server

Recomendações de livros

Postado por: Pedro Rogério em
  • 29 jun
  • 7

Nesse post vou tentar mostrar alguns ótimos livros que recomendo para aqueles que querem ingressar no mundo do desenvolvimento web, pois, quem trabalha nesse ramo sabe que deve devorar informação, seja ela de sites, blogs ou livros. Alguns deles já são bem conhecidos pelas pessoas, outros não, mas fica aqui a dica:

Construíndo sites com CSS e (x)HTML

Construíndo sites com CSS e XHTML

Esse foi o primeiro livro totalmente nacional, lançado pelo Maujor sobre CSS, para quem quer aprender CSS esse deve ser ser livro de cabeceira. Este livro aborda a técnica de construção de sites baseada nas Web Standards do W3C, cujo princípio básico é separar a marcação (X)HTML da apresentação visual. De forma didática, são apresentadas as razões da criação das Web Standards e suas vantagens, a sintaxe (X)HTML e CSS, as propriedades CSS e a criação de layouts fixos e elásticos multicolunares. Os assuntos tratados são ilustrados com códigos, exemplos e figuras que mostram a renderização no navegador. No site de apoio, o leitor encontrará os códigos para download e informações complementares sobre o livro.

Continuar lendo »

O que é DHTML?

Postado por: Pedro Rogério em
  • 13 mai
  • 4
DHTML

A maioria dos desenvolvedores web, na verdade, não sabem, ou têm apenas uma vaga idéia do que significa o termo, portanto, vou tentar explicar da forma mais simples possível o que é DHTML. Quando a versão 4 dos browsers Netscape e Internet Explorer foi lançada ocorreu uma pequena revolução na Internet. Enquanto o suporte a CSS nesses browsers era precário estava nascendo uma nova união de tecnologias que iria revolucionar a forma de desenvolver páginas web. Foi então que no final dos anos 90 e início do ano 2000 nascia o DHTML (Dynamic HTML).

DHTML é a união das tecnologias HTML, Javascript e CSS aliado ao Document Object Model (DOM), para permitir que uma página Web seja modificada dinamicamente na própria máquina cliente, sem necessidade de novos acessos ao servidor web. Quando você efetua mudanças de estilo em elementos HTML e a mudança é registrada imediatamente sem o recarregamento da página, você está vendo um exemplo de DHTML. Você também pode fazer o usuário integarir com a página escondendo e mostrando elementos, mover elementos na página, mudar cores.

Continuar lendo »

Contar e limitar caracteres em textarea

Postado por: Pedro Rogério em
  • 3 abr
  • 10

jQuery Limit plugin é muito útil se você precisa cortar e limitar caracteres de textareas ou campos input. A utilização é muito simples, basta ficar atento a seguinte estrutura html:

Ainda restam <span id="left"></span> caracteres a serem digitados.
<textarea>Lorem ipsum dolor sit amet,</textarea>

Depois basta definir no JavaScript o número máximo de caracteres e qual elemento irá mostrar a contagem de caracteres, no exemplo foi um span com o id “left”:

$('textarea').limit('140','#left');

Se você não deseja mostrar ao usuário o número de caracteres restantes, basta deixar o código dessa forma:

$('textarea').limit('140');

Vejam o exemplo.

Páginas:123»