Dec-07 26

Varios scritps em AJAX

Enviado por: Thales RB. .     1 comentário.     Categorias: AJAX, Scripts

 Voltado as atividades aqui no site.

Eu achei um site muito legal que tem uma grande seleção de scripts que usam Ajax, são mais de 50 scripts e todos com uma imagem de preview, para ter uma ideia das funcionalidades, só que todo o conteudo está em ingles

http://miniajax.com

Dec-07 20

Mostrando conteudo em abas

Enviado por: Thales RB. .     Sem comentários.     Categorias: AJAX, HTML-CSS, Scripts

Hoje eu estava procurando algum sistema de abas, pra usar no meu CMS, e no trajeto achei varios interessantes, vou fazer uma lista deles. Mas todos eles são de sites em ingles

Esse usa algumas imagens nas abas deixando um efeito bem legal:

http://dhtmlx.com/docs/products/dhtmlxTabbar/index.shtml

esse usa ajax para caregar o conteudo, só tomem cuidado com o SEO :

http://20bits.com/2007/05/23/dynamic-ajax-tabs-in-20-lines/

esse é legal por que, não é preciso clicar na aba é só passar o mouse em cima:

http://www.kollermedia.at/archive/2007/07/10/easy-tabs-12-now-with-autochange//

Esse é interessante pois cada aba tem um link(o que eu estava procurando) ou seja com esse link ele já abre na aba desejada:

http://phrogz.net/JS/Tabtastic/index.html

Achados em: http://www.linksweb.com.br/ 

Dec-07 19

Formatação de textos HTML, com editor WYSIWYG

Enviado por: Thales RB. .     11 comentários.     Categorias: Aprendendo PHP, Blogs, HTML-CSS, Javascript, Scripts

Para quem oferece algum sistema, onde qualquer pessoa possa enviar textos é interessante, ter um editor para formatação de textos, já que não é qualquer um que sabe comandos HTML para formatar o texto. E o seu uso é recomendado para não permitir que qualquer comando HTML possa ser usado, já que alguns comandos poderiam arruinar o seu Layout

Para fazer isso existem dois tipo de editores:

WYSIWYG(What You See Is What You Get), que é um editor visual ou seja ao usa-lo você já verá o texto formatado, igual o word, g-mail, wordpress, etc.

BBCODE(Bulletin Board Code), que é uma simples função para substituir caracteres, ex: a tag <b></b> ficará [b][/b], como o seu nome diz ele foi criado para fóruns, onde é encontrado comumente, para criar um editor desse é preciso saber bastante programação, já que é preciso, substituir todos os caracteres, e bloquear o uso de outros comandos html.

Usando um WYSIWYG

Os editores desse tipo, são de uso mais facil, pois são feitos com Javascript, e podem ser usados com qualquer tipo de sistema, PHP, ASP, etc.

Quando eu estive procurando por isso, achei um monte de editores assim, mas não consegui usar ou adaptar ao que eu queria quase nenhum.

O unico que eu me dei bem foi o TinyMCE. Veja aqui um exemplo dele Para usa-lo é bem simple, com o download dele em alguma pasta do seu sistema, e adicione o seguinte no arquivoirá usa-lo

<script type=”text/javascript” src=”pasta_onde_esta_os_arquivos/tinymce/tiny_mce.js”></script>

[code="javascript"][/code]

Esse segundo javascript serve para formatar a exibição, no caso aqui ele irá aparecer todas as opções, mas como ele usa um esquema de plugins, cada botão é um plugin, então é possiveo formatar isso.

Como pode ser visto ele tem theme_advanced_buttonsX_add e na frente de cada uma tem os botões que seram mostrados, ou seja é só deletar o nome do botão para remove-lo. E se não for usar um botão pode remover a sua pasta dentro do tinymce para ficar mais leve.

Adicionando esses scripts ele irá adicionar o editor em todas as textareas que houver na página.

Dec-07 07

Adicionando o efeito de neve ao seu site

Enviado por: Thales RB. .     12 comentários.     Categorias: Desenvolvimento, HTML-CSS, Javascript, Scripts

Para entrar no espírito de natal é legal adicionar algo no site, mudar o layout ou criar um logo de natal, mas isso pode dar trabalho, algo bem facil de se fazer é colocar um efeito de neve caindo. Por isso vou postar um script em javascript que faz isso.

Um exemplo de como ficará pode ser visto aqui.

Ele usa uma imagem de neve então copie essa imagem aqui(ou qualquer uma a sua escolha)

neve

o link para essa imagem é http://i12.tinypic.com/6uscqjq.gif

para usa-lo é bem simples simplesmente copie todo o conteudo a seguir e cole após o <body> de seu site.

(more…)