Grow your CSS skills. Land your dream job.

Jquery click CSS problem…in Chrome only?

  • # February 27, 2013 at 4:24 am

    Well this is just infuriating.

    http://keithpickering.net/site-designs/#comments

    I’m working on some styles for featured and buried comments. Click the buried comment and the “buried” class is removed, like this:

    $(document.body).on(‘click’, ‘.buried’, function() {
    $(this).removeClass(‘buried’);
    });

    It works, but in Chrome and Chrome alone, the columns act all weird after the “buried” class is removed. Check it out in Chrome to see what I mean.

    If you go into the style editor and uncheck+recheck literally ANY style, it will work as expected.

    I’m pretty stumped with this.

    # February 27, 2013 at 5:18 am

    Absolutely no problem on Chrome Canary. It works like a charm.

    # February 27, 2013 at 5:22 am

    Why not;

    $(‘.buried’).on(‘click’, function() {
    $(this).removeClass(‘buried’);
    }

    Or Zoidberg.

    # February 27, 2013 at 12:34 pm

    That’s what I tried to begin with, but it doesn’t work for some reason

    # February 27, 2013 at 12:42 pm

    Did you check console? Here it says “Uncaught SyntaxError: Unexpected token , “… So there is a JS error in your html output on… line 1 xD Too bad everything is on line 1.

    # February 27, 2013 at 12:48 pm

    I think I fixed it by adding “white-space: nowrap” to the comment module.

    But I’m still curious as to why this was actually happening.

    EDIT: Seems it also works when I get rid of the “border: 0″ declaration on the “buried” module and instead set the border-color to the same as the background.

    # February 27, 2013 at 12:50 pm

    I’m not getting any errors in firebug, although I was testing some stuff a minute ago so that might be why you got an error.

    Another reason why I need to figure out a way to work on my site offline, but I have no idea how without manually downloading and re-uploading it every time I want to change something :P

    # February 27, 2013 at 1:01 pm

    `$(document.body).on(‘click’,’.buried’,function(){$(this).css({‘height’,’auto’});});` I think that was where the error came from.

    Now it works (in Chrome 25), seeing you made that click listener removing the buried class again.

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".