<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Select box event</title> <script type="text/javascript"> function swapImage(hash) { document.getElementById('imageSwap').src = hash + '.jpg'; } </script> </head> <body> <div id="builder_image"> <img src="rw_blue.jpg" id="imageSwap" alt="" /> </div> <select name="option3" onchange="swapImage(this.options[selectedIndex].label)"> <option value="No thanks" selected="selected" label="rw_blue">No thanks</option> <option value="Blue" label="rw_blue">Blue</option> <option value="Black" label="rw_black">Black</option> <option value="Red" label="rw_red">Red</option> </select> </body> </html>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter