Unable to use CSS for select tag?
Simple changes approve it.
Use prototype framework
Simple changes approve it.
Use prototype framework
<html> <head> <script type='text/javascript' src='js/prototype.js'></script> <script type='text/javascript'> function change_country(type, value) { $('country_type').value=type; $('country_value').value=value; } </script> <style type="text/css"> #select_countries { border: 1px solid #333; margin-top: 5px; height: 200px; width: 200px; overflow: auto; } </style> </head> <body> <form action="" method="post"> <fieldset> <legend>Countries</legend> <input type="text" name="country_value" id="country_value" value="United States" /> <input type="hidden" name="country_type" id="country_type" value="us" /> <a href="#" onclick="Element.show('select_countries'); return false;">Click to change</a><br /> <div id="select_countries" style="display: none;"> <div id="close" onclick="Element.hide('select_countries'); return false;">Close</div> <div onclick="change_country('us', 'United states')"><img src="images/flags/us.gif" alt="us" /> United states</div> <div onclick="change_country('ru', 'Russia')"><img src="images/flags/ru.gif" alt="us" /> Russia</div> <div onclick="change_country('es', 'Spain')"><img src="images/flags/es.gif" alt="us" /> Spain</div> <div onclick="change_country('ca', 'Canada')"><img src="images/flags/ca.gif" alt="ca" /> Canada</div> </div> </fieldset> </form> </body> </html>
