Because we're still checking for possible issues with plugins, we're stuck on jQuery 1.2.6 for the moment.
My problem arise in a context where I have a <div id="container">...</ div> that contains, among other things, a number of nested clusters of the following form: <div class="outer"> <img class="bgimg" src="whatever" /> <div class="hoverpad"></div> </div> The div.outer is sized and absolutely positioned by jQuery in relation to window dimensions. The img.bgimg serves as an auto-sizing background image by virtue of the CSS "width:100%;height:100%;". The div.hoverpad is sized and absolutely positioned by jQUery to occupy the bottom 75% of the div.outer. I don't want hover and click actions to be triggered by the top 25% of the div.outer, so rather than attaching them by jQuery to the div.outer, I attach them to the div.hoverpad, which has no content and no purpose other than to field mouse events. This all works exactly as planned on Firefox, Opera and Chrome. But on IE7 -- I haven't even tried IE6 yet -- the hover and click events don't fire. However, if I use CSS to apply a non-transparent background-color to the div.hoverpad, then the events fire. Of course, applying such a background-color is not a practical possibility because it partially masks the background image of the div.outer. If I attach a click action to all DIVs and alert the target of the click event, all the non-IE browsers report the div.hoverpad, whereas IE7 reports the IMG. I'm sure this must be an old problem that has been solved many times before, but I haven't managed to track down a solution. Can anyone suggest a way to make it work on IE7, or alternatively suggest a different approach to my goal that will overcome IE7's obduracy? Thanks in advance. Ed
