css jquery div hover in IE

Question

I am trying to make an accordion image gallery that works based off an ordered list. The markup is as follows:

<ol>
    <li class="slide">
        <div class="header"></div>
        <div><img src="/some/path/" /></div>
    </li>
</ol>

The stage URL: http://host3.webdrafter.com/majesticbuildersmn.com/

slide class is intended to be the hover state (as illustrated by the red border). Of course it all works great except in IE - the hover state will only hover if it can grab text. I think this is a known issue with IE so is there a viable workaround?

EDIT: Needs to work for IE 8+ & adding text to the header div allows IE to catch the hover state but only over the text, no other area of the div

Is IE throwing an error? If jQuery is handling the slide animation there shouldn't be any problems cross browser. — uadnal
– uadnal, Commented Jun 19, 2012 at 20:08
There's no errors, it's just that the hover state is only really activated in IE if i throw some text in the div and then hover the text. Otherwise - nothing. — Jared Eitnier
– Jared Eitnier, Commented Jun 19, 2012 at 20:11
we develop for ie 8 and up so i have no clue what ie7 looks like. — Jared Eitnier
– Jared Eitnier, Commented Jun 19, 2012 at 20:15

Huangism · Accepted Answer · 2012-06-19 20:20:30Z

1

Look into the width and height for IE

I tried it on IE9 and it looks like if you hover the top area, it works but not lower. By top I mean near top and also I am not sure how you defined this slider (js) but when I change the height of header, the visual width seems to change

Edit: for IE 9 I hovered on the red border and it moves other than that it does not work. Maybe it's a z-index issue or something. I am not sure but I hope it helps you to trouble shoot it

answered Jun 19, 2012 at 20:20

Huangism

16.5k7 gold badges51 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jared Eitnier Over a year ago

Well you're kind of onto something - the script is to set an inline style on the div but in IE it isn't showing. Using the dev console i was able to set the correct values but it's still quirky.

Huangism Over a year ago

ok in that ase you might need to tweak the css to make it work or adjust your script so it is easier for IE to access

Collectives™ on Stack Overflow

css jquery div hover in IE

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related