Changing a Drop Down list using Javascript to select multiple images?

See more:

Javascript

HTML

menu

drop-down

, +

Hello

I have a Drop Down List in a web page, what it currently does is displays an individual image that is selected in the list.

Please find my code below.

What I want to achieve is if a sector is selected such as pubs for example, It will display a group of images of pubs instead of one individual image, anyone with any knowledge of doing this?.If I select another option such as University it would display multiple images of University logos.

Also is there a way to add a mouse-click hyperlink to an image even if I am using it as a drop down list?.

I presume this is possible but I cannot find much information on the subject.

Any assistance would be great, Thanks in advance.

HTML

<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="gfx/Marstons.jpg">Marstons pubs</option>
                        <option value="gfx/NorthUni.jpg" href="http://www.northumbria.ac.uk/">Northumbria University</option>
                    </select>
                </p>
            </form>
        </td>
    </tr>
    <tr>
        <td width="100%">
            <p align="center">
                <img src="gfx/Marstons.jpg" name="pictures" width="99" height="100">
        </td>
    </tr>
</table>

JS

function showimage() {
    if (!document.images) return
    document.images.pictures.src = document.mygallery.picture.options[document.mygallery.picture.selectedIndex].value
}