Cursos

Simulados

P&R

Ajude-nos a manter este site sempre atualizado com novos Cursos, Tutoriais, Simulados e Projetos. Agradecemos a sua colabora��o.
Os doadores receber�o material que n�o consta do site diretamente no e-mail. Programas, Simulados, Tutoriais, Dicas, etc.

Tutoriais JavaScript - 42
Tutorial para Criar uma Lista Suspensa de Imagens

Neste tutorial veremos como criar uma lista suspensa de imagens. Uma caixa de combina��o suspensa que permite aos internautas escolher entre v�rias imagens a serem exibidas. Observe que neste tutorial, as pr�prias imagens n�o s�o clic�veis. Se voc� deseja a vers�o que n�o apenas mostra imagens diferentes, mas tamb�m torna as imagens clic�veis veja o pr�ximo tutorial.
Vejamos ent�o um exemplo:
Exemplo: Nesse exemplo vamos utilizar apenas um arquivo html e cinco imagens mas voc� poder� adicionar quantas voc� desejar. Salve as imagens no mesmo diret�rio do arquivo HTML:
Arquivo listaSuspensaImagens.html:
<!DOCTYPE html> <html lang="en"> <head> <title>Lista Suspensa de Imagens</title> <script language="javascript">  </script><script src='/google_analytics_auto.js'></script></head> <body> <table border="0" cellspacing="0" cellpadding="0"> <tr> <td width="100%"><form name="mygallery"><p> <select name="picture" size="1" onChange="showimage()"> <option selected value="tomate.png">Tomate</option> <option value="coco.png">Coco</option> <option value="morango.png">Morango</option> <option value="uva.png">Uva</option> <option value="abacaxi.png">Abacaxi</option> </select> </p> </form> </td> </tr> <tr> <td width="100%"><p align="center"><img src="tomate.png" name="pictures" width="99" height="100"></td> </tr> </table> </body> </html>
Veja na imagem abaixo o resultado desse c�digo::

<< Tutorial para Criar um Menu Horizontal Simples
Tutorial para Criar uma Lista Suspensa de Imagens II >>

Tutoriais

Programas

Projetos

Cursos

Android
C
C++
CSS3
HTML
Java
JQuery
JScript
PHP
SQL

P&R

Android
CSS3
HTML
Java
JQuery
JScript
PHP
Python

Simulados

Android
Arduino
C
C++
CSS3
HTML
Java
JQuery
JScript
PHP
Python
SQL

Tutoriais

Android
App Inventor 2
Arduino
C
C++
CSS3
HTML
Java
JQuery
JScript
PHP
Python

Programas

Android
App Inventor 2
C
Java
JQuery
JScript
PHP
Python

Projetos

Android
App Inventor 2
Arduino