Editor de HTML5 em tempo real

Publicado por Perfil removido em 15/12/2011

[ Hits: 12.072 ]

0 0

Denuncie Favoritos Indicar Impressora

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!

O editor está atualmente neste link:

http://fretsonfire.x10.mx/projetos/html5_editor

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

Place Menu Indicator - Acesses suas pastas pelo painel do Unity

ZynAddSubFX - programa para composição musical

Usando comandos do sistema em C

Como executar o BlueGriffon (DreamWeaver do Linux) [Vídeo]

Configuração do Squid via modo gráfico

Leitura recomendada

Incentivando o uso do Webm, formato aberto de "codec" (conteiner) de vídeo

Criando variáveis dinamicamente com Javascript

Efetuando debug de JavaScript no Mozilla

Evitando que sua página fique entre frames

Copiando imagens bloqueadas

Comentários

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

Muito boa a dica ... compartilhado !!!

0 0

[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).

0 0

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

Muito boa dica, eu uso editor HTML. Favoritado.

0 0

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

não funciona no Google Chrome.

0 0

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

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

0 0

[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;

0 0

[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.

0 0