Click event slow in Chrome and Safari

Well, I came across an interesting quirk. Click events in Chrome and Safari were taking a couple of seconds before they were being fired. It was quite the head scratcher.

Here’s essentially what I was doing:

<script>
        $(".example").delegate("a", "click", function(event) {
            $("h2").toggle();
        });
</script>

<div class="example">
    <a href="#">
        Toggle Title
    </a>
    <h2>TITLE</h2>
</div>​

At first, I just changed the <a> tag to be a <span> tag, and that worked. But, I couldn’t figure out why an anchor tag was having this problem. I had been doing similar things in other parts of the application, and it was working fine.

When I made the simple script above in jsFiddle, I couldn’t reproduce it. So, I started pulling out things slowly.

That’s when I noticed it was something that Omniture was doing. I’m not sure I could tell why that particular element was being slow. My guess was maybe that it was nested too deep, and something Omniture was doing was making it slow.

Either way, the fix of changing it to a <span> tag seemed to fix it.

Leave a Reply