Webgrafismo » AJAX http://www.webgrafismo.com Os Melhores Recursos Open Source para Web Developers Thu, 13 May 2010 10:01:44 +0000 en hourly 1 Ajax.org – Plataforma de Aplicações Open Source http://www.webgrafismo.com/extras/plataforma/ajax-org-plataforma-de-aplicacoes-open-source/ http://www.webgrafismo.com/extras/plataforma/ajax-org-plataforma-de-aplicacoes-open-source/#comments Fri, 18 Dec 2009 12:57:06 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=4555 Recursos Relacionados:
]]> Ajax.org é uma plataforma de aplicações RIA escrita em javascript que pretende auxiliar programadores na construção de aplicações via browser, com um aspecto visual semelhante às aplicações de desktop. Estas aplicações RIA são uma combinação do melhor de dois mundos.

A plataforma Ajax.org tem as vantagens do desktop no que concerne ao tempo de resposta do cliente, pois a maioria do processamento é feita no lado do cliente e muito pouco no lado do servidor. Contudo, a informação representada no ecrã tem mais densidade, e não precisa de ser refrescada. Alguns exemplos são: animações, menus, janelas e outros itens.

Ajax.org

Requisitos: -
Demonstração: http://www.ajax.org/#demos
Licença: LGPL

Recursos Relacionados:

]]> http://www.webgrafismo.com/extras/plataforma/ajax-org-plataforma-de-aplicacoes-open-source/feed/ 2 Loja Online dentro de Páginas com AJAX http://www.webgrafismo.com/extras/plataforma/loja-online-ajax-paypal-google-checkout/ http://www.webgrafismo.com/extras/plataforma/loja-online-ajax-paypal-google-checkout/#comments Tue, 27 Oct 2009 13:22:46 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=4327 Recursos Relacionados:
]]> Ecwid é uma plataforma de comércio electrónico em Ajax, a qual oferece a performance que necessita, sem qualquer incómodo. Está bem desenhada e proporciona uma experiência suave para os utilizadores e proprietários de lojas. Ecwid dispõe de uma interface rápida, com funcionalidades drag’n'drop e, é muito fácil de integrar.

Registe-se no Ecwid, e imediatamente depois de colar simplesmente 3 linhas de HTML no código fonte do seu website, você irá ter todo o potencial e capacidades para venda. O código irá renderizar um loja online dentro das páginas existentes, usando AJAX.

Ecwid

Use o Painel de Administração para adicionar produtos e para gerir as definições da sua loja online. Todas as alterações irão se reflectir instantaneamente no seu website.

Requisitos: -
Demonstração: http://www.ecwid.com/
Licença: Gratuito

Recursos Relacionados:

]]> http://www.webgrafismo.com/extras/plataforma/loja-online-ajax-paypal-google-checkout/feed/ 1 Tutorial de site em jQuery com refrescamento AJAX http://www.webgrafismo.com/tutoriais/ajax/tutorial-de-site-em-jquery-com-refrescamento-ajax/ http://www.webgrafismo.com/tutoriais/ajax/tutorial-de-site-em-jquery-com-refrescamento-ajax/#comments Mon, 26 Oct 2009 05:04:24 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=4288 Recursos Relacionados:
]]> James Padolsey é um freelancer web developer de Hampton, UK. Ele escreve sobre front-end web development. O seu tópico preferido: Javascript. Este tutorial ensina-lhe a criar um layout assíncrono, levando o utilizador a interagir com a informação contida em várias páginas, sem haver refrescamento pelo browser.

Instalação

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

<!-- index.html -->
 
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type">
<title>mmm... Ajax!</title>
<script type="text/javascript" src="jquery.js"></script>
<style type="text/css">
@import url(css.css);
</style>
<script type="text/javascript" src="js.js"></script>
</meta></head>
<body>
    <div id="wrapper">
    <h1>ajax ... nettuts</h1>
    <ul id="nav">
        <li>welcome</li>
        <li>about</li>
        <li>portfolio</li>
        <li><a href="contact.html">contact</a></li>
        <li><a href="terms.html">terms</a></li>
    </ul>
    <div id="content">
        <h2>Welcome!</h2>
        <p>Text</p>
    </div>
    <div id="foot">Tutorial by James for NETTUTS</div>
</div>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

<!-- js.js -->
 
$(document).ready(function() {
 
    // Check for hash value in URL
    var hash = window.location.hash.substr(1);
    var href = $('#nav li a').each(function(){
        var href = $(this).attr('href');
        if(hash==href.substr(0,href.length-5)){
            var toLoad = hash+'.html #content';
            $('#content').load(toLoad)
        }
    });
 
    $('#nav li a').click(function(){
 
    var toLoad = $(this).attr('href')+' #content';
    $('#content').hide('fast',loadContent);
    $('#load').remove();
    $('#wrapper').append('<span id="load">LOADING...</span>');
    $('#load').fadeIn('normal');
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
    function loadContent() {
    	$('#content').load(toLoad,'',showNewContent())
    }
    function showNewContent() {
    	$('#content').show('normal',hideLoader());
    }
    function hideLoader() {
    	$('#load').fadeOut('normal');
    }
    return false;
 
    });
});

Demonstração: Site em jQuery com Refrescamento AJAX
Download: Download Site em jQuery
Licença: Ver no site Nettuts

Recursos Relacionados:

]]> http://www.webgrafismo.com/tutoriais/ajax/tutorial-de-site-em-jquery-com-refrescamento-ajax/feed/ 4 20 Efeitos Ajax para Vender Mais Websites http://www.webgrafismo.com/componentes/galeria/20-efeitos-ajax-para-vender-mais-websites/ http://www.webgrafismo.com/componentes/galeria/20-efeitos-ajax-para-vender-mais-websites/#comments Sun, 10 May 2009 17:01:47 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=2971 Recursos Relacionados:
]]> Como deve estar ciente das capacidades que o Ajax tem oferecido aos web developers, hoje temos para lhe mostrar 20 efeitos fantásticos que utilizam a tecnologia Ajax. Todos eles são gratuitos e podem ser experimentados antes de passar para a sua implementação. Certamente irá reconhecer alguns de websites famosos como Facebook ou Apple.

1) Menu de Imagens

Menu de Imagens Mootools

O Menu de Imagens é uma amostra das capacidades que JavaScript oferece que utiliza imagens para criar um menu de imagens horizontal. Quando você passa o rato sobre os links, a imagem expande e mostra o resto da imagem. Este efeito é compatível com a maioria dos browsers modernos incluindo Internet Explorer 8.

Demonstração: http://www.phatfusion.net/imagemenu/index.htm
Download: http://www.phatfusion.net/imagemenu/imagemenu.zip

2) ImageFlow

Galeria de Imagens ImageFlow

ImageFlow é um script para galeria de imagens com usabilidade amigável. A galeria possui como características um barra de scroll muito elegante para navegar através das imagens, e todas as imagens encaixam no topo de um reflexo, criando um efeito semelhante ao utilizado pela Mac.

Demonstração: http://imageflow.finnrudolph.de/
Download: http://finnrudolph.de/ImageFlow/Download

3) Instant.js

Instant.js

Se estiver à precisar de adicionar alguma às suas imagens um background interessante, rotações e outros efeitos, Instant.js pode ser precisamente o que anda à procura. O JavaScript funciona graciosamente, onde em situações que browsers não tenham JavaScript activado nem irão notar a diferença.

Demonstração: http://www.netzgesta.de/instant/
Download: http://www.netzgesta.de/instant/instant.zip

4) Glassbox

Glassbox

Já todos ouvimos falar de Lightbox, ShadowBox e mesmo GreyBox, mas e então GlassBox? GlassBox é uma livraria para interfaces que utiliza Scriptaculous e Prototype. A livraria muito interessante irá adicionar bordas com luminosidades, efeitos translúcidos e outros efeitos semelhantes ao flash, verdadeiramente estonteantes. É fácil de utilizar, personalizável (com temas) e ainda tem carregamento de conteúdo dinâmico.

Demonstração: http://www.glassbox-js.com/#examples
Download: http://www.glassbox-js.com/#download

5) Search Field CSS/JS

Search Field CSS/JS

Os campos de pesquisa que realizam o “auto-complete” são altamente valiosos quando chega a altura de interagir com o utilizador. Por vezes o pesquisador não sabe bem o que está à procura, por isso qualquer coisa que ajude o utilizador a encontrar exactamente o que pretende é um grande benefício. CSSGlobe tem um tutorial muito bom para poder aplicar o “Search Field” com um pouco de CSS e Ajax.

Demonstração: http://cssglobe.com/lab/searchfield/
Download: http://cssglobe.com/lab/searchfield/searchfield.zip

6) Protoload

Protoload

Carregar imagens e campos é algo importante para aplicações web modernas que usam Ajax. Protoload dá-lhe algo do género, construído com opções para ajudar a mostrar ao utilizador o que se está a passar enquanto ele espera. O script dá-lhe muitas opções como cores nas layers para carregar elementos, textos personalizados, e muitas mais opções.

Demonstração: http://aka-fotos.de/protoload/
Download: http://aka-fotos.de/protoload/package/protoload0.1beta.zip

7) jwysiwyg

jwysiwyg

jwysiwyg é um script JavaScript jQuery muito poderoso e extremamente leve. O plugin tem muitas das características standard dos editores WYSIWYG (What You See Is What You Get), e pesa apenas 7kb.

Download: http://code.google.com/p/jwysiwyg/downloads/list

8 – jquery.biggerlink 2

jquery.biggerlink 2

Bigger link 2 é um plugin muito simples que faz com que links grandes sejam mais fáceis de realizar. Permite também embeber links dentro de elementos links, se isso lhe parece fazer sentido (veja as demonstração para maior clareza). (Bigger Link 2 corre na popular framework JavaScript jQuery.)

Demonstração: http://net.tutsplus.com/
Download: http://www.ollicle.com/eg/jquery/biggerlink2/jquery.biggerlink.js

9) jQuery Tag Suggestion

jQuery Tag Suggestion

“Sugestões de Tags” é uma utilização popular de Ajax nas aplicações web modernas. Muito semelhante à caixa de pesquisa “Search Field CSS/JS”, o plugin “jQuery Tag Suggestion” (fácil de usar) faz  que qualquer aplicação que a utilize se torne + rápido de encontrar a tag desejada. Um efeito simples mas eficiente na área de acessibilidade.

Demonstração: http://remysharp.com/wp-content/uploads/2007/12/tagging.php
Download: http://remysharp.com/downloads/tag.js

10) Facebox

Facebox

Facebox é um script lightbox único que aplica o estilo ligthbox de Facebook. Construído em jQuery, Facebox dá a sensação e a aparência quase exacta da interface de Facebook, e é muito simples de instalar.

Demonstração: http://famspam.com/facebox
Download: http://famspam.com/facebox/releases/facebox-1.2.tar.gz

11) Humanized Messages

Humanized Messages

Humanized Messages é um plugin jQuery muito interessante que faz tal como o nome sugere: cria mensagens amigáveis para o utilizador. O plugin JavaScript faz isto pela criação de mensagens translucidas sobre o ecrã, e lentamente desvanece com o tempo.

Demonstração: http://binarybonsai.com/misc/humanmsg/
Download: http://code.google.com/p/humanmsg/

12) LightWindow v2.0

LightWindow v2.0

LightWindow é outro plugin Lightbox, mas que adiciona várias funcionalidades que plugins do seu género parecem deixar de fora. Para iniciantes, o plugin permite renderizar e usar conteúdos multimédia dentro de lightboxes. Filmes, imagens, mesmo galerias podem ser mostradas com a LightWindow. Perfeito para demonstração multimédia sem necessidade de refrescamento da página.

Demonstração: http://stickmanlabs.com/lightwindow/#demos
Download: http://stickmanlabs.com/lightwindow/#download

13) Unobtrusive Table Actions

Unobtrusive Table Actions

As tabelas com dados é muitas vezes difícil de exibir eficazmente, especialmente quando se pretende organizar linhas e colunas. O “Unobtrusive Table Actions” é um JavaScript que permite diferentes efeitos sejam colocados numa tabela. Realce de linhas, colunas, ordenação de dados, e muito mais pode ser realizado com o apoio deste pequeno script.

Demonstração: http://www.frequency-decoder.com/demo/table-actions/
Download: http://www.frequency-decoder.com/demo/table-actions/tableActions.zip

14) jQuery checkbox

jQuery checkbox

jQuery checkbox adiciona um pequeno efeito a campos do tipo checkbox em formulários. Adiciona um botão muito semelhante ao da interface do iPhone, dando um “On” e “Off” muito distinto em relação ao habitual criado pelos browsers. É muito bom para usabilidade, e o aspecto gráfico pode ser alternado com muita elegância.

Demonstração: http://widowmaker.kiev.ua/checkbox/
Download: http://plugins.jquery.com/files/jquery-checkbox.1.3.0b1.zip

15) iCarousel

iCarousel

Os carroceis são uma óptima forma de alternar o conteúdo, como por exemplo imagens ou histórias entre notícias. O plugin iCarousel encaixa lindamente com esta tarefa. É um script simples que oferece um monte de opções para configurar mediante as suas necessidades.

Demonstração: http://zendold.lojcomm.com.br/icarousel/#selflink_examples
Download: http://zendold.lojcomm.com.br/icarousel/#selflink_download

16) MochaUI

MochaUI

MochaUI é outra livraria “User Interface” para a framework JavaScript Mootools. MochaUI basicamente constrói uma interface de utilizador completa para websites, formulários e widgets. Inclui um browser para ficheiros, redimensionamento de janelas, layouts baseados em painéis, layouts baseados em separadores, e muito mais.

Demonstração: http://mochaui.com/demo/
Download: http://code.google.com/p/mocha-ui/downloads/list

17) jTip

jTip

jTip é um conceito simples, ainda assim muito eficaz para melhor funcionalidades quando o rato está sobre determinado elemento. Baseado em jQueyr, jTip simplesmente adiciona uma caixa elegante para links pré-configurados numa página, tudo com ajuda de algum Ajax.

Demonstração: http://www.codylindley.com/blogstuff/js/jtip/
Download: http://www.codylindley.com/blogstuff/js/jtip/jTip.zip

18) Uni-Form

Uni-Form

Os formulários foram sempre um grande quebra-cabeças para web developers durante anos e anos. E, tecnologias como Ajax tem grandiosamente ajudado a experiência do utilizador no que concerne esta área. Com Ajax, você pode processar formulários em tempo-real, validá-los e enviar respostas sem a necessidade de recarregar a página. Uni-Form é um pequeno script Ajax que é um conceito “plug-in-play” que tenta estandardizar a marcação do formulário com XHTML e modular o formulário, de tal forma que elementos individuais possam ser fácilmente adicionados ou removidos.

Demonstração: http://sprawsm.com/file_download/2/uni-form.zip
Download: http://www.sprawsm.com/uni-form/

19) Validation Hints

Validação de Formulários

Validation Hints é um script simples que ajuda na validação de dados nos formulários. Ele garante que campos como password e username são de um comprimento específico, e pode mesmo validar contra expressões regulares. Pequeno mas útil.

Demonstração: http://www.askthecssguy.com/examples/validationhints/formfieldhints.html
Download: http://www.askthecssguy.com/examples/validationhints/validationhints.zip

20) Control Tabs

Control Tabs

Control Tabs, (parte da robusta livraria UI LivePipe), é um script muito bom que lhe oferece muitas formas diferentes de configurar separadores numa página. Você pode usar a interface standard dos separadores, ou então usar algo como imagens para mostrar os separadores. Control Tabs é um script robusto e que ainda possui uma API que pode usar e configurar as suas interfaces.

Demonstração: http://livepipe.net/control/tabs
Download: http://github.com/syntacticx/livepipe-ui/tarball/master

Recursos Relacionados:

]]> http://www.webgrafismo.com/componentes/galeria/20-efeitos-ajax-para-vender-mais-websites/feed/ 8 Popup em Javascript com carregamento AJAX http://www.webgrafismo.com/componentes/popup/popup-em-javascript-com-carregamento-ajax-modalbox/ http://www.webgrafismo.com/componentes/popup/popup-em-javascript-com-carregamento-ajax-modalbox/#comments Mon, 04 May 2009 21:59:22 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=2953 Recursos Relacionados:
]]> ModalBox é uma técnica em JavaScript para criar diálogos modernos (estilo Web 2.0) ou ainda diálogos parametrizados sem usar o convencional popup com carregamento de páginas. É inspirado nos módulos de diálogo Mac OS X. E pode de facto ser útil para mostrar versões de imagens grandes.

O que é ModalBox?

ModalBox é construído através de puro JavaScript e é baseado na excelente Prototype JavaScript Framework de Sam Sthephenon’s, script.aculo.us e XHTML/CSS válido. ModalBox usa AJAX para carregar conteúdo.

A técnica ModalBox está ainda em desenvolvimento. Sinta-se à vontade de submeter bugs aqui: http://code.google.com/p/modalbox/

Fontes de Inspiração

Basicamente, ModaBox é baseado na técnica GrayBox por Amir Salihefendic. Mas você pode encontrar um monte de técnicas semelhantes pela web: Lightbox JS, Lightbox gone wild, ThickBox etc.

Existe também um clone de ModalBox, o MOOdalBox, escrito na grande e leve Mootools Framework.

Modal Box JavaScript Popup

Características ModalBox

  • NOVO! “Modo-offline”. Usa HTML sem qualquer chamada Ajax para preencher a sua janela de diálogo.
  • Carregamento de página AJAX. ModalBox usa AJAX em vez de iframe para carregar o conteúdo. É também mais seguro – você pode aceder a páginas que não estão no seu servidor.
  • Suporte de chamadas. Você pode ancorar os seus próprios eventos JavaScript depois de exibir ou ocultar (e mais) o ModalBox.
  • NOVO! Ajuste da altura automático. O ajuste em altura do ModalBox depende do seu conteúdo. Acabou-se os problemas relacionados com o dimensionamento em altura!
  • NOVO! “Modo de scrolling”. Se o seu conteúdo é longo, defina apenas a altura do ModalBox e ele alternará num “modo de scrolling”.
  • Independente do Browser e plataforma. Desde que os mais modernos browsers usam bloqueadores de popup’s, é difícil encontrar um modo de criar 100% compatibilidade no browser para estes diálogos.
  • Multi-propósito. Você pode criar modelos complexos para guiar utilizadores através do processo. Slideshows de imagens podem também ser criadas.
  • Suporta tecla para encerramento. Use a tecla ESC para fechar o ModalBox.
  • Aspecto e Sensação Personalizável. Use CSS no ModalBox para criar o aspecto que pretende.
  • Suporta efeitos de transição. Deslize para baixo ou redimensione.
  • Leve. Apenas 10 KB de código.
  • Trabalha nos mais modernos browsers. Testado em IE6, IE7, Firefox 1.0, 1.5, 2.0, Safari, Camino, Opera 8 e 9.

ModalBox no Google.Code

Encontrou um bug ou algo para dizer? Dê uma vista de olhos no projecto ModalBox no Google.Code: http://code.google.com/p/modalbox/

Existe também um Modalbox Google Group que existe para o caso de encontrar uma solução ou necessitar de pedir ajuda. Você pode também usar este eemail para publicar neste grupo: modalbox@googlegroups.com

Documentação

A referência do Modalbox assim como a documentação adicional pode ser encontrado em Modalbox Google Code page.

Website: http://www.wildbit.com/labs/modalbox/
Demonstração: http://www.wildbit.com/projects/modalbox/frame-demo-step1.php

Recursos Relacionados:

]]> http://www.webgrafismo.com/componentes/popup/popup-em-javascript-com-carregamento-ajax-modalbox/feed/ 0 Criando Formulários Bonitos Facilmente http://www.webgrafismo.com/design/formularios/criando-formularios-bonitos-facilmente/ http://www.webgrafismo.com/design/formularios/criando-formularios-bonitos-facilmente/#comments Wed, 18 Mar 2009 21:26:04 +0000 skin http://www.webgrafismo.com/?p=2871 Recursos Relacionados:
]]> Nos tempos que correm é quase que obrigatório ter um design atraente e funcional. E um dos factores que muitas dores de cabeça dá aos web designers são os formulários, todos os campos, os botões, a organização, etc. Mas há ferramentas espalhadas pela rede das redes, a internet, que podem facilitar e até realizar esse trabalho pelo web designer e hoje venho-vos apresentar uma delas.

A Wufoo Form Gallery é um local onde web developers e webdesigners podem encontrar grandes ajudas no desenvolvimento de formulários de contacto com os visitantes das suas páginas, um ponto fulcral no desenvolvimento de qualquer website.

E porquê escolher a WuFoo Form? Entre muitas razões pela sua rapidez e facilidade de uso, bem como pelo preço (“muitos serviços grátis” soa bem não soa?).

Página Oficial: http://secure.wufoo.com/gallery/
Tour Pelos Serviços WuFoo: http://secure.wufoo.com/tour/

Recursos Relacionados:

]]> http://www.webgrafismo.com/design/formularios/criando-formularios-bonitos-facilmente/feed/ 3 Ajaxify jQuery plugin http://www.webgrafismo.com/componentes/carregamento/ajaxify-jquery-plugin/ http://www.webgrafismo.com/componentes/carregamento/ajaxify-jquery-plugin/#comments Mon, 22 Dec 2008 16:00:19 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=1244 Recursos Relacionados:
]]> Ajaxify é um plugin jQuery. Pode converter todos os links e pedidos de uma página web para carregamentos ajax. Com este plugin ultra leve, você pode construir um website complexo em ajax com apenas uma linha. Bemvindo ao mundo web 2.0!!!

Características Principais:

Pedidos Ajax “GET” e “POST”
Histórico & suporte para bookmarking
Carregamento parcial apartir do output
Suporta quatro eventos
Suporta Formulários
Animações

Utilização

Uma linha de código pode fazer o trabalho:

$('.ajaxify').ajaxify();

E o código HTML irá ser algo como isto:

<a class="ajaxify" href="example.php" target="#container">Clique aqui</a>

Existem muitas opcções que poderá utilizar. Veja aqui a página de demos.

Requisitos: Plataforma jQuery
Compatibilidade: Todos os principais browsers
Demonstração: http://max.jsrhost.com/ajaxify/demo.php
Licença: Gratuito
Download: ajaxify-v2.zip

Recursos Relacionados:

]]> http://www.webgrafismo.com/componentes/carregamento/ajaxify-jquery-plugin/feed/ 4 Obter Tabelas Dinâmicas MySQL com PHP e AJAX http://www.webgrafismo.com/design/tabelas/obter-tabelas-dinamicas-mysql-com-php-e-ajax/ http://www.webgrafismo.com/design/tabelas/obter-tabelas-dinamicas-mysql-com-php-e-ajax/#comments Sat, 06 Dec 2008 16:15:01 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=1125 Recursos Relacionados:
]]> O Eyesis Data Grid Control é tudo o que precisa quando chega a altura de exibir dados apartir de uma base de dados MySQL para tabelas. Não é utilizado flash dinâmico ou código complexo em javascript, assim como ínfimas classes ambíguas baralhando todo o projecto. Esta classe é simples, pequena, e fácil de implementar com apenas 6 linhas de código. Não acredita? Veja os exemplos…

Algumas das características incluídas:

  • Capacidades de filtragem e de busca
  • Habilidade de mudar cabeçalhos das colunas
  • Capacidade de exibir imagens
  • Paginação automática
  • Selecção de linhas
  • Suporte de dados MySQL
  • Suporte Ajax
  • Ocultar colunas
  • Ordenar colunas
  • Personalização do visual através de CSS
  • Pode lidar com grandes conjuntos de dados
  • Capacidade de adicionar controlos
  • Suporta caixas de selecção (checkbox)
  • Especificar tipos de formato da coluna (como %, dólares, euros, etc)
  • Testado e trabalhando no Firefox 2 e 3, o IE 6 e 7, Chrome, Safari 3 e Opera 9
    Só PHP 5
  • E muito mais!

Tabelas Dinâmicas SQL PHP

Em poucos segundos, são criadas tabelas dinâmicas, muito fáceis de usar no seu website.

A título de exemplo, a tabela acima foi construída com apenas 6 linhas de código. Você mesmo pode recriar a imagem acima activando Ajax com apenas 1 linha de código.

Demonstrações:

Exemplo 1 – Tabela de Dados básica [Ver] [Fonte]
Exemplo 1.5 – Tabela de Dados com AJAX [Ver] [Fonte]
Exemplo 2 – Filtros, Cabeçalhos, Tipos de Colunas [Ver] [Fonte]
Exemplo 3 – Mais propriedades [Ver] [Fonte]
Exemplo 4 – Selecção de Linhas [Ver] [Fonte]
Exemplo 5 – Demonstração Total com Ajax [Ver] [Fonte]

Download: eyedatagrid-1.1.zip
Website: http://www.eyesis.ca/projects/datagrid.html
Licença: Gratuito

Recursos Relacionados:

]]> http://www.webgrafismo.com/design/tabelas/obter-tabelas-dinamicas-mysql-com-php-e-ajax/feed/ 40 Seadragon Ajax * Zoom de Imagens em Profundidade http://www.webgrafismo.com/componentes/demonstracao/zoom-de-imagens-em-profundidade-com-seadragon-ajax/ http://www.webgrafismo.com/componentes/demonstracao/zoom-de-imagens-em-profundidade-com-seadragon-ajax/#comments Sun, 30 Nov 2008 00:31:11 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=705 Recursos Relacionados:
]]> Seadragon é uma tecnologia da Microsoft, para ampliar imagens de qualquer tamanho em grande profundidade. A aplicação dispõe de transições quase perfeitas, independentemente do tamanho que as imagens tiverem.

Seadragon Ajax é uma tecnologia ao alcançe de todos. Pode-se usar/embutir a interface em qualquer website.

Seadragon pode ser usado de 2 maneiras:

Os web developers podem personalizar o modo de visualização e os controlos, com a livraria disponível Seadragon Ajax. Está também disponível esta aplicação na plataforma Silverlight.

Website: http://livelabs.com/seadragon-ajax/
Demonstração: http://livelabs.com/seadragon-ajax/gallery/

Recursos Relacionados:

]]> http://www.webgrafismo.com/componentes/demonstracao/zoom-de-imagens-em-profundidade-com-seadragon-ajax/feed/ 1 Calendário Ajax com Mootools estilo Windows Vista http://www.webgrafismo.com/componentes/calendario/calendario-ajax-do-tipo-windows-vista-com-mootools/ http://www.webgrafismo.com/componentes/calendario/calendario-ajax-do-tipo-windows-vista-com-mootools/#comments Tue, 11 Nov 2008 06:00:48 +0000 Pedro Magalhaes http://www.webgrafismo.com/?p=328 Recursos Relacionados:
]]> O Calendário Ajax do tipo Windows Vista (vlaCalendar) está na versão 2 e é uma versão para a internet que utiliza a plataforma JavasScript Mootools, AJAX, XHTML, CSS e PHP.

O script do calendário dinâmico em Ajax é licenciado sob uma atribuição Creative Commons 3.0 – Não Comercial. Ou seja, pode utilizar estes ficheiros como bem entender, mas não os pode redistribuir sem autorização do autor para fins comerciais.

Requisitos: Plataforma Mootools
Demonstração: http://dev.base86.com/scripts/vista-like_ajax_calendar_version_2.html
Licença: Creative Commons 3.0

Recursos Relacionados:

]]> http://www.webgrafismo.com/componentes/calendario/calendario-ajax-do-tipo-windows-vista-com-mootools/feed/ 1