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>

Reply via email to