Editor de HTML5 em tempo real

Publicado por Perfil removido em 15/12/2011

[ Hits: 11.886 ]

 


Editor de HTML5 em tempo real



Estou aprendendo a criar algumas animações com HTML5 e me surgiu a necessidade de um programa onde pudesse visualizar aquilo que estou desenhando (seja em objetos 2D, onde está minha fase atual de estudos, ou objetos 3D).

Então pensei: Isto é perfeitamente possível de se fazer utilizando apenas o próprio HTML5. Então botei a mão na massa!
Linux: Editor de HTML5 em tempo real

O editor está atualmente neste link:
Basta digitar o código na caixa de cima e todo o conteúdo do seu código será representado graficamente na caixa de baixo, em tempo real. Creio que não seja necessário nenhum 'manual' para usá-lo, certo? hehe.

O editor é compatível com todos os elementos do HTML5, Canvas e WebGL.

Há um código de exemplo no site para que possam ver o editor em funcionamento.

Bons estudos.

Outras dicas deste autor

Netflix nativo no Slackware 14.2 usando Firefox

Configurando Speedy no Conectiva 10

Instalando o Mercury no Mandriva One e superior

Criando um simples script para desmontar e ejetar o CD-ROM

Lilo com framebuffer em 1280x800 ou outra resolução suportada

Leitura recomendada

Copiando imagens bloqueadas

Slide de imagens em jQuery

Evitando que sua página fique entre frames

Criando variáveis dinamicamente com Javascript

HTML - Forçar a abertura de todos os links em uma nova janela

  

Comentários
[1] Comentário enviado por gugahb em 15/12/2011 - 10:55h

Muito boa a dica ... compartilhado !!!

[2] Comentário enviado por akirabra em 15/12/2011 - 11:04h

Bom trabalho parabéns. Fiz alguns testes meu pareceu uma ideia muito promissora.
Também gostei da sua mensagem de página não encontrada (rsrsrsrs).

[3] Comentário enviado por albfneto em 15/12/2011 - 11:25h

Muito boa dica, eu uso editor HTML. Favoritado.

[4] Comentário enviado por vicente386 em 15/12/2011 - 12:29h

não funciona no Google Chrome.

[5] Comentário enviado por removido em 15/12/2011 - 13:02h

Agradeço os comentários pessoal. Sobre o Google Chrome, vou verificar.

[6] Comentário enviado por maxwellz em 15/12/2011 - 13:33h

Compatibilidade com Chrome
Linha 189 na Função atualiza()
var d = frameDinamica.document;
Troca por:
var d = window.frames['frameDinamica'].document;

[7] Comentário enviado por removido em 15/12/2011 - 15:47h

@maxwellz Obrigado! Mas infelizmente não funcionou =/

Estou fazendo alguns testes aqui, mas sinceramente não sei o que pode ser.

[8] Comentário enviado por maxwellz em 15/12/2011 - 17:09h

var d = window.frames['frameDinamica'];



Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts