Arquivos da categoria: diversos

Como pegar um parâmetro da url usando javascript

3 respostas

Pessoas, me deparei com um problema aqui no trabalho e tive que fazer uma função básica pra pegar um parâmetro da url, seja ele com “?”, “&” ou até âncora “#”, achei que poderia ser útil pra mais alguém, segue o código

	function getParameter(p,href){
		var parName = p.replace(/[[]/,"[").replace(/[]]/,"]");
  		var rx = new RegExp("[?&#]"+parName+"=([^&#]*)");
  		var valor = rx.exec(href);
  		if(valor == null){
    		return "";
		}else{
    		return valor[1];
		}
	}

Como onde eu precisei usar, a url nem sempre estava no browser, eu estou passando ela por parâmetro, esta função retorna o valor do parâmetro que você procurou, ou retorna vazio se não encontrar nada, ex:

        alert(getParameter('parametroDaUrl',location.href));

Espero que seja útil

Formalize CSS, seus problemas de formatação de formulários acabaram.

2 respostas

Bom, sei que o título é meio sensacionalista, mas a idéia do Formalize-CSS é realmente muito interessante.

Era uma vez um desenvolvedor web que perdia noites de sono ajustando os seus formulários tentando ao máximo fazer com que ficassem semelhantes nas diferentes versões de navegadores existentes hoje no mercado.

Foi então que o  Nathan Smith criou o Formalize-CSS para não perder sua sanidade, e como se não bastasse isso ele fez com que seu plugin funcionasse com Mootools, JQuery, Dojo, Prototype e YUI.

Ele também disponibilizou o projeto no GitHub para que você possa contribuir com o código.

Na página de demonstração tem screenshots do mesmo formulário em diversos navegadores e sistemas operacionais diferentes, muito interessante.

Parabéns Nathan ( se você conseguir me entender ;) ), e não deixem de conferir o trabalho dele aqui.

jQuery “Descontruído”

Deixe um comentário

Alguns anos atrás quando descubri o prototype me deparei com um framework elegante, leve e que resolvia grande parte dos problemas da época com a incompatibilidade dos navegadores e ainda por cima trazia funções que agilizavam o desenvolvimento javascript.

Estudar o código do prototype foi certamente o melhor experiência de aprendizado que tive em termos de javascript e abriu portas para algumas aplicações RIA que viriam a seguir.

Hoje o framework do momento e  com a filosofia mais “bacana” é o jQuery e uma grande oportunidade de aprender com seu código-fonte está em jQuery Deconstructed.

Nele você pode analisar de uma maneira bem intuitiva com as funções colapsadas e com links entre elas.

Se você quiser realmente ser um “Javascript Rockstar” estudar o jQuery é o caminho. ;)

27 links muito úteis para se ter no bookmark

Deixe um comentário

Que paginação que nada! o esquema é carregar no scroll
http://cfsilence.com/blog/client/index.cfm/2007/8/21/Ajax-Paging-Through-Records-On-Scroll

Precisa de algo que bloqueie a tela com fullscreen pra qualquer finalidade? Login, Alerts, Confirm, iFrame, Etc…?
http://malsup.com/jquery/block/#demos

Calendário de eventos em Ajax, Leve e altamente customizável
http://www.webappers.com/2009/05/27/lightweight-highly-customizable-ajax-events-calendar/

O NiceEdit é uma Opção leve e simples ao FckEditor, claro que não tem todos os recursos do FCK, mas é um ótimo editor pra coisas mais simples (Editor de HTML WYSIWYG)
http://www.nicedit.com/

Quer manter o histórico de suas navegações em Ajax? Esta é uma maneira bem simples.
http://codinginparadise.org/weblog/2005/09/ajax-dhtmlhistory-and-historystorage.html

Tooltips, aprenda a fazer bem feito! :-)
http://www.filamentgroup.com/lab/image_free_css_tooltip_pointers_a_use_for_polygonal_css/
http://plugins.learningjquery.com/cluetip/demo/
http://jquery.bassistance.de/tooltip/demo/

Exemplo bacana de preview de imagens estilo tooltip
http://cssglobe.com/lab/tooltip/02/

Excelente opção de Dropdown estilo iPod/iPhone
http://www.filamentgroup.com/lab/jquery_ipod_style_and_flyout_menus/

Esse site tem ótimos scripts pra diversas utilidades de scroll
http://flowplayer.org/tools/scrollable.html

Script muito bacana de scroll SEM scroll!
http://demos.flesler.com/jquery/localScroll/#section1c

Exemplo bacana de scroll de imagens
http://css-tricks.com/examples/MovingBoxes/

Crie qualquer atalho pra qualquer coisa
http://code.google.com/p/js-hotkeys/

Faça cópia de eventos de elementos para outros.
http://examples.learningjquery.com/51/copyEventsTo.html

Um game baseado em jQuery
http://ajax.phpmagazine.net/2008/11/redline_jquery_powered_racing.html

Consulte o EXIF de imagens usando javascript
http://blog.nihilogic.dk/2008/05/reading-exif-data-with-javascript.html

25 formas de otimizar seu código jQuery
http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx

Substitua seus alerts, confirm, e prompts por uns outros bem mais legais
http://www.webappers.com/2008/12/31/jquery-alert-confirm-and-prompt-dialogs-replacements/

Procurando por gifs ou imagens para ajax loading? customize o seu nesse site
http://preloaders.net/

Widgets muito bacanas como Timeline(must see), Gráfico, Coverflow
http://code.google.com/p/simile-widgets/

Scroll de imagens e preview, ótima opção pra exibição de produtos.
http://zendold.lojcomm.com.br/icarousel/

Maneira bonita de se fazer fullsize de imagens
http://www.addfullsize.com/

Exemplo bacana de autocomplete ou suggest em jQuery
http://loopj.com/2009/04/25/jquery-plugin-tokenizing-autocomplete-text-entry/

Site com muitos games em javascript
http://www.javascriptgaming.com/

Converta string de xml em um objeto DOM usando jQuery
http://outwestmedia.com/jquery-plugins/xmldom/

Galeria estilo iPhoto, muito bacana
http://nettuts.s3.amazonaws.com/357_gallery/demo/index.html#

Alguns comentário sobre o Google Developer Day

4 respostas

Primeiro foi apresentado algumas novidades muito expressivas sobre o HTML5

Algo muito explorado é o Canvas que permite via javascript criar e manipular imagens e formas como vetor, segue alguns exemplos demostrados

Bespin:

http://labs.mozilla.com/projects/bespin/

É um editor de código todo em canvas

Pipes(Yahoo):

http://pipes.yahoo.com/pipes/

Sim, o apresentador estava com camisa do firefox, usou firefox o tempo todo, e apresentou esta ferramenta do Yahoo como um dos cases no uso de canvas!
Com o pipes é possível criar diagramas como se você estivesse usando o Visio ou algo do gênero, você pode movimentar os diagramas e suas ligações acompanham cada caixa, algo antes só possível com flash ou aplicativos desktop

Depois foi a vez de aplicações com audio e video nativos do HTML5, seguem outros exemplos bacanas.
Video em http://mozbox.org/ : os links para o exemplo não estão facilmente distribuidos aqui, mas ao vivo foi mostrado a manipulação de video em tempo real usando efeitos e até mesmo um chroma key em tempo real, onde via javascript colocava a midia dentro de uma variável e nela apagava o RGB da cor de fundo e então substituia por outra imagem qualquer, que pra variar foi usado um logotipo do firefox :)
Audio em http://hyper-metrix.com/misc/jai/ :  aqui você consegue encontrar facilmente o player e códigos para download

Tanto audio como video com tags próprias para o HTML5, pra variar, o IE não suporta todos os recursos do HTML5

Depois do HTML5, foi apresentado alguns projetos do Google de ferramentas colaborativas open social
- Friendconnect: Ele é uma API que é uma espécie de ponte entre diversos serviços como Orkut, Twitter, Etc…

- WebElements: Outra API que permite a qualquer um inserir com facilidade na sua página algum elemento como o GoogleMaps, ou os últimos Twitts, etc…

Encerrando esta sessão, foi a vez do Google Wave
Realmente a criatura é fantástica, ele ainda esta em Dev e com vários Bugs que obrigou os palestrantes a dar vários F5s durante a demostração, mas tirando isso… o conceito que é empregado é muito inovador.
Ele é uma mistura de email com chat e com compartilhamento de informação, você pode interagir com os participantes nos documentos e textos e em tempo real você consegue ver o que o outro esta escrevendo, as fotos que ele esta colocando(que são arrastadas diretamente do seu desktop para o browser), você pode fazer comentários isolados no meio de um texto, e imagina tudo isso acontecendo ao mesmo tempo! Foi realmente uma ótima apresentação, o corretor ortográfico ficou tão aprimorado que ele chega ao ponto de analizar o contexto do que você esta escrevendo para corrigir as palavras conforme o texto se desenvolve.
Um dos participantes que você pode adicionar na conversa é um robô tradutor que traduz em tempo real pra qualquer idioma o que você esta escrevendo.
Mesmo com bugs eu adoraria experimentar o Wave, não pude ficar até o final do evento, tive que sair depois do almoço.
Aliás, este ano o evento estava muito melhor organizado, a equipe de organização do evento esta 100% de parabéns.
Ah… e desculpem pela falta de fotos, eu fiquei muito entusiasmado com tudo que nem pensei em tirar foto :-s

Atualizado: Eles me mandaram um convite para participar do Wave o/

Flex Mania 2009, participe! é on-line

1 resposta

Olá pessoal, vai acontecer no dia 06/07/2009 o Flex Mania 2009 que é um evento voltado para desenvolvedores com interesse em tecnologia Adobe Flex e tendências RIA (Rich Internet Application) e olha só, eu vou participar como um dos palestrantes!
Não tem desculpa de que vai estar trabalhando porquê o evento é online!

Flex Mania 2009