Posts da categoria Mootools

Substituir Checkbox por Imagem

FancyForm faz a substituição de checkbox por imagens. A técnica é conhecida como checkbox replacement. Apenas como citação, no caso de textos chamam de image replacement ou text replacement.

Esse script propicia formulários um pouco diferentes, mais requintados em termos de design. Fácil de configurar e usar.

fancy-form

Site: http://lipidity.com/fancy-form/

Demo: http://lipidity.com/fancy-form/demo/

Licença: Free.

Menu de Contexto

mif.menu é um menu de contexto que utiliza mootools. Esse menu aparece no clique do botão direito do mouse sobre uma determinada área.

Possui algumas variações, desde simples estilos até outros mais trabalhados com CSS.

mif-menu

Site: http://mifjs.net/trunk/menu/

Demo: http://mifjs.net/trunk/menu/Demos/index.html

Licença: Creative Commons Attribution-NonCommercial-ShareAlike 3.0 License.

Tooltip de Notificação - Roar

Roar é um widget de notificação no estilo Growl, o sistema de notificação do Mac OS X. Com mootools, fácil de usar e customizar para mostrar mensagens diversas.

roar

Site: http://digitarald.de/project/roar/

Demo: http://digitarald.de/project/roar/1-0/showcase/messages/

Licença: MIT License.

Galeria de Fotos com Mootools

Galeria de Fotos usando PHP e Mootools. Além de compacta, foi desenvolvida de forma modular e orientada a objetos. Possui inúmeras funcionalidades:

  • 4 diferentes tipos de designs;
  • Visualizador de Thumbnails;
  • Upload de imagens incluído;
  • Fácil manutenção;
  • Esconder/mostrar thumbnails;
  • Ajuste automático das imagens;
  • Não necessita de banco de dados.

e2

Site: http://www.e2interactive.com/e2_photo_gallery/

Demo: http://www.e2interactive.com/e2_photo_gallery/demo.php

Licença: Open Source (licensa um pouco confusa e com limitações).

Google Maps com lightbox

GMapsOverlay apresenta uma técnica combinada: através de um lightbox abre uma janela com um mapa para navegar. Utiliza mootools.

gmapsoverlay

Site: http://dev.visualdrugs.net/mootools/gmapsoverlay/

Demo: http://dev.visualdrugs.net/mootools/gmapsoverlay/

Licença: Não especificada.

Gráficos com PHP e Flash

Open Flash Chart possibilita gráficos interativos com Flash e PHP.  Muito fácil de usar e manipular. Pode ser fácilmente adaptado para mostrar informações - de forma gráfica - de um banco de dados.

Possui inúmeros tipos de gráficos: linhas, pizza, barras, área, pareto, etc.

A biblioteca permite inclusive inclusive interagir com os gráficos através de javascript; como redimensionar gráficos e carregar eles dinamicamente via Ajax.

open-flash-chart

Site: http://teethgrinder.co.uk/open-flash-chart-2/

Demo: http://teethgrinder.co.uk/open-flash-chart-2/tutorial.php

Licença: LGPL.

Ajax Upload

Ajax Upload permite enviar vários arquivos sem acontecer o refresh na página. Pode trabalhar tanto com jQuery, Mootools ou Prototype.

ajax-upload

Site: http://valums.com/ajax-upload/

Demo: http://valums.com/wp-content/uploads/ajax-upload/demo-jquery.htm

Licença: MIT License.

Grid com Mootools - OmniGrid

OmniGrid foi inspirado em dois componentes: FlexGrid jQuery e phatfusion sortable table.

Permite fácil integração com banco de dados, tem paginador, busca, filtros, scroll de dados, ordenação e redimensionamento de colunas, etc

omnigrid

Site: http://www.omnisdata.com/omnigrid/

Demo: http://www.omnisdata.com/omnigrid/

Licença: Creative Commons Attribution 3.0 Unported License.

Menu dropdown com Mootools

MenuMatic é um menu elegante e profissional, desenvolvido com mootools. Pode ser utilizado na horizontal ou na vertical.

menu-matic

Site: http://greengeckodesign.com/projects/menumatic.aspx

Demo 1: http://greengeckodesign.com/projects/menumatic/examples/horizontal/

Demo 2: http://greengeckodesign.com/projects/menumatic/examples/vertical/

Licença: Não especificada.

Slider com Abas

Slider com navegação em abas - além dos tradicionais botões de avançar e anterior. Utiliza mootools.

slider

Site: http://creativepony.com/journal/scripts/sliding-tabs/

Demo: http://creativepony.com/demos/sliding-tabs/

Licença: Creative Commons.