Question

Hallo,

I’m working on a website which is pretty simple and old. We just use standard ASP there is no JavaScript framework or something and I can’t really program JavaScript.

I have a cell in a table and in there I want to have between 1 and 7 select’s. If there are seven I don’t have enough space and because our company uses Internet Explorer the select boxes don’t get bigger when you open them.

So I thought i could do some kind of javascript or something to just make one of the select boxes bigger when the mouse is over it.

How would I do that?

Answer 1

Have you tried Cialis ? :p

Seriously now, if the select boxes change size on mouseover they may break layout and depending on conditions make it impossible to select something..

the way to do it though would be

<script type="text/javascript">
  var selects = document.getElementsByTagName('select')
  for (var i=0;i<selects.length;i++)
     {
       selects[i].onfocus = function(){ 
                                  this.oldwidth = this.style.width; 
                                  this.style.width = 'auto';
                            }
       selects[i].onblur = function(){
                                  this.style.width = this.oldwidth;
                            }
      }
</script>

can be seen live at http://www.jsfiddle.net/YN37p/

update

also have a look at http://www.jsfiddle.net/YN37p/1/ for use of classes and a workaround to an issue in the previous solution, where you need to click twice to open select box.