Recentemente, publicamos alguns artigos sobre os novos botões sem imagem do Google:
- http://stopdesign.com/archive/2009/02/04/recreating-the-button.html
- http://stopdesign.com/eg/buttons/3.0/code.html
- http://stopdesign.com/eg/buttons/3.1/code.html
- http://gmailblog.blogspot.com/2009/02/new-ways-to-label-with-move-to-and-auto.html
Eu realmente gosto de como esses novos botões funcionam no Gmail. Como posso usar esses botões ou outros semelhantes em meu site? Há algum projeto de código aberto com aparência e comportamento semelhantes?
Se eu quisesse lançar meu próprio pacote de botões como este usando JQuery / XHTML / CSS, quais elementos eu poderia usar? Meus pensamentos iniciais são:
Padrão
<input type="button">
com css para melhorar a aparência (o artigo de design falava principalmente sobre os envolvimentos de css / imges).Jquery javascript para abrir uma caixa de diálogo personalizada com raiz no botão no evento "onclick" que teria
<a>
tags e uma barra de pesquisa para filtragem? Um layout de tabela para esse pop-up seria lógico?
Eu sou péssimo em coisas de engenharia reversa na web. Quais são algumas das ferramentas que eu poderia usar para ajudar na engenharia reversa desses botões? Usando a barra de ferramentas para desenvolvedores web do Firefox, não consigo ver o css ou javascript (mesmo que esteja reduzido) que é usado nas caixas de diálogo pop-up dos botões. Que ferramenta de navegador ou outro método eu poderia usar para espiá-los e obter algumas ideias?
Não estou procurando roubar nenhum IP do Google, apenas tenho uma ideia de como eu poderia criar uma funcionalidade de botão semelhante.
<button type="submit">
vez disso, use um , pois ele pode ter elementos filho e ser estilizado como você quiser.