Como criar uma combo box com links clicáveis para páginas da internet

Escrito por betty quinton | Traduzido por eudes filho gomes
  • Compartilhar
  • Tweetar
  • Compartilhar
  • Pin
  • E-mail
Como criar uma combo box com links clicáveis para páginas da internet
Combo boxes são um ótimo acréscimo a qualquer website (website layout image by 6922Designer from Fotolia.com)

Uma combo box é uma ferramenta muito usada em websites. Trata-se de uma lista clicável em cascata que normalmente é criada usando-se formulários HTML. Você pode adicionar uma funcionalidade especial para ele adicionando um pouco de JavaScript no seu HTML. Essa funcionalidade inclui a mudança de uma página da web quando um link é clicado no menu em cascata do combo box. Por exemplo, você pode criar uma combo box que solicita que o usuário escolha entre três websites, levando-o ao site que ele selecionou.

Nível de dificuldade:
Moderadamente fácil

Outras pessoas estão lendo

O que você precisa?

  • Editor de texto

Lista completaMinimizar

Instruções

  1. 1

    Abra seu editor favorito (o Bloco de Notas servirá perfeitamente).

  2. 2

    Digite o seguinte código HTML:

    <HTML> <BODY> <script type=\"text/javascript\"> function link_go(){ if (document.link_form.link_sel.options[document.link_form.link_sel.selectedIndex].value != \"none\") { location = document.link_form.link_sel.options[document.link_form.link_sel.selectedIndex].value } }

    document.write('<form name=\"link_form\"><select name=\"link_sel\" size=1 onchange=\"link_go()\">') GO document.write('<option value=none>Selecione sua página de destino') GO document.write('<option value=none>--------------------') GO document.write('<option value=\"http://www.google.com.br\">Google') GO document.write('<option value=\"http://www.yahoo.com.br\">Yahoo') GO document.write('<option value=\"http://www.ehow.com.br\">eHow') GO document.write('</select>') GO document.write('</form>') GO </script>

    </BODY> </HTML>

  3. 3

    Vá para "Arquivo", "Salvar como" e salve seu arquivo com o nome "ComboBox.html" e clique em "Salvar".

  4. 4

    Em "Meu Computador", navegue até a pasta em que você salvou o arquivo. Clique duas vezes no arquivo ".html". Uma janela do navegador abrirá com a página que você criou. Você verá sua combo box com o texto "Selecione sua página de destino"; selecione "Google", "Yahoo", ou "eHow". Quando você clicar, seu navegador irá automaticamente ser redirecionado ao site.

  5. 5

    Você pode adicionar páginas à sua combo box usando a seguinte sintaxe: document.write('<option value=\"http://www.sua_pagina_aqui.com\">Nome da página') Ir

    Substitua "sua_pagina_aqui" pelo link para o qual você quer que os usuários sejam redirecionados, e mude "Nome da página" para a maneira como você quer que apareça no combo box.

Não perca

Filtro:
  • Geral
  • Artigos
  • Slides
  • Vídeos
Mostrar:
  • Mais relevantes
  • Mais lidos
  • Mais recentes

Nenhum artigo disponível

Nenhum slide disponível

Nenhum vídeo disponível