I am trying to get a click event on the whole div area around the image that toggles a menu. In FireFox I can click on the whole div and my functionality works.
In IE7 I have to click only on the tiny arrow icon. How do I allow the whole div to control the event? $(document).ready(function() { $('ul.linkContainer:not(:first)').hide(); $('div.arrowToggle').click(function() { var $nextUL = $(this).next(); var $visibleSiblings = $nextUL.siblings('ul:visible'); if ($visibleSiblings.length ) { $visibleSiblings.slideUp('fast', function() { $nextUL.slideToggle('fast'); }); } else { $nextUL.slideToggle('fast'); } }); }); <div class="arrowToggle" style="position: absolute; width: 30px; height: 13px; left: 185px; border: 1px solid red;"> <img style="width: 12px; height: 12px; float: right;" src="/images/arrow_right.png"/> </div>