jquery IE support for show()

Question

All,

I have the following code ,

    <div id="show" display="none"></div>

    var ele=document.getElementById('show');
    ele.style.display='block';
    ele.style.padding='1px';
    ele.style.borderLeft='solid 1px #d0d0d0';
    ele.style.borderBottom='solid 1px #a0a0a0';
    ele.style.position='absolute';
    ele.style.borderTop='solid 1px #d0d0d0';
    ele.style.borderRight='solid 1px #a0a0a0';
    ele.style.backgroundColor='#ffffaa';
    ele.style.fontSize='12px';
    ele.style.fontFamily='helvetica';
    ele.style.color='black';

    $(window).mouseover(function(event) {
     $("#show").css({'top': (event.pageY)/2, 'left': '10px'});
    });

In internet explorer the div does not get displayed could someone please tell me the code change to make it work on IE.

Thanks...................

Answer 1

You haven't called show...

$("#show").show();

Answer 2

I think you should take out the following line:

ele.style.display='block';

And then call your jQuery like this:

$("#show").css({'top': 100, 'left': 10}).show();// element gets passed to callback function

You may notice that I gave top a fixed value, just so that you can determine that the element gets displayed AT ALL. If it does, then you can safely say that IE does not get the value of event.pageY. Also, pixel-value css properties are defined like above, if I am correct.

Answer 3

First of all, move CSS to a class

#show {
// put it here
}

Why use javascript when you can do it with CSS? May be IE problem is with that part of JavaScript code.

And your is empty, hell, but how do you want to see an empty div???? Put some text and try again.