Rogério Lino

Web development and tips

Javascript: Jump Menu

Uma grande maioria dos desenvolvedores web não gostam cara padrão dos Jump Menus. Então por que não fazer um?

Pensando assim que fiz um script para gerar um Jump Menu, ou ComboBox se prefirir. Ele é composto por uma

(para moldura), uma (para servir como rótulo) e uma lista não-ordenada de links (
    ).

    Para usá-lo, a única coisa que devemos fazer, além de linkar o script ou adicioná-lo no corpo da página, é instanciar o Objeto. E passar como parâmetro um array de array, contendo esse último na primeira posição a url e na segunda o texto a ser exibido. Após isso feito, escolha aonde adicioná-lo (pack) através do id da tag.

    Ex:

    var itens = Array();

for (var i=0; i<15; i++) {
    itens[i] = ['http://rogeriolino.com/', 'item ' + (i+1)];
    var menu = new JumpMenu(itens);
    menu.setLabel(' + Click Here');
    menu.pack('teste');
}

    Para o visual basta usar de todo o potencial do CSS e estilizar como preferir.

    Clique aqui para conferir o exemplo contendo o código.

Comments