event.layerX error when using click() in jQuery

Question

This is driving me nuts, I can't see the problem. Using jQuery (I'm stuck with v 1.6.2 btw as it's within a CMS), I'm trying to show a div of content by clicking on a link.

Here's my HTML:

        <div id="vl-hcp" class="venue">
            <h1>Title of venue</h1>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor.</p>
        </div>

<div class="venuesScroller">    
<a href="javascript:void(0);" class="vl-hcp"><span>Title of venue</span></a>
</div>

Here's my jQuery:

    $('.venuesScroller a').click(function(){
        // Make only currently clicked link active and hide other info boxes
        $('.venuesScroller a').removeClass('active');
        $('.venue').addClass('hidden');

        // Make link active and go through cases for showing text
        $(this).addClass('active');
        if($(this).hasClass('vl-hcp')) {
            $('#vi-hcp').removeClass('hidden');
        }
});

But no classes are changed on the venue div when I click the link and in Chrome (version 17.0.963.56), I'm getting the error:

event.layerX and event.layerY are broken and deprecated in WebKit. They will be removed from the engine in the near future.

Can anyone see what the issue is? I'm really stuck here.

Thanks,

Osu

that's not an error, its a warning. – TimCodes.NET Feb 23 '12 at 21:24 — TimCodes.NET, Feb 23 '12 at 21:24

Shad · Accepted Answer · 2012-02-23T21:53:17.380

1

It's not an error, it's a warning.

When jQuery normalizes the event object, it iterates over all of the properties that it might have, and when it touches layerX and layerY, Chrome's JS Engine throws the warning.

If the issue is that the hidden class isn't being removed from #vl-hcp, it's because of a typo:

$('#vi-hcp').removeClass('hidden');

should be

$('#vl-hcp').removeClass('hidden');

edited Feb 23 '12 at 21:53

answered Feb 23 '12 at 21:23

Shad

15,134
2
22
34

True, but my code still isn't working even when I remove the warning using Alexander's technique above. Is there any reason it wouldn't work? It's not working in Safari nor Firefox 9 on Mac either... – Osu Feb 23 '12 at 21:49
I feel very stupid. Thanks for pointing out, it's been a long night! – Osu Feb 23 '12 at 21:56

score 0 · Answer 2 · edited May 23 '17 at 11:48

0

I used the below code from here to fix these warnings. This is a workaround to avoid updating the jQuery yet.

(function(){
    // remove layerX and layerY
    var all = $.event.props,
        len = all.length,
        res = [];
    while (len--) {
      var el = all[len];
      if (el != 'layerX' && el != 'layerY') res.push(el);
    }
    $.event.props = res;
}());

More information can be found in the same referring question.

edited May 23 '17 at 11:48

Community

1
1

answered Feb 23 '12 at 21:27

Alexander

23,432
11
63
73

thanks for this, I saw that other post and tried it, but I still can't get my jQuery code to work. Can you see why it might not be working? Thanks – Osu Feb 23 '12 at 21:46

event.layerX error when using click() in jQuery

2 Answers2