The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Programming Fundamentals" Dec 02 - 2:00 PM Eastern

Making jQuery stop working at a certain page width

  • # January 9, 2013 at 12:33 am

    I am using a plugin called “sticky” that makes a portion of my site act like it’s position:fixed.

    I am now onto the media query portion, I am making the site scale down for mobile, but I need the sticky plugin to stop working past say 880px. Not sure how to go about doing this.

    I use that code in the footer to activate it. Is there a way to have a stop function at a width?

    On another thought, since im running it through a WP function file, anyway to dequeue it at a width and requeue if resized again?

    # January 9, 2013 at 12:44 am

    This reply has been reported for inappropriate content.

    You would say “if the window width is greater or equal to 880px, run the sticky()”

    var $window = $(window);
    if( $window.width() >= 880 ){

    # January 9, 2013 at 12:48 am

    Thanks! Works well, however you have to reload if the browser is manually re sized. I’ll use this, but is there some way around that?

    # January 9, 2013 at 1:22 am

    This reply has been reported for inappropriate content.

    Try this (I haven’t tested)

    var stickActivated = false;
    function addSticky(){
    if ( stickActivated ) {
    if ( $(window).width() >= 880){
    stickActivated = true;


    # January 9, 2013 at 1:51 am

    Thanks but no go on that.

    Edit: Actually, it works from going from the smaller size to larger. But not the reverse.

    # January 9, 2013 at 2:33 am

    This reply has been reported for inappropriate content.

    Yeah that’s how it should work. The only way to “Reverse” what .stick() has done is to actually know what it’s doing and manually reverse it. Unless they’ve created an .unsticky() method but I’m sure they haven’t.

    # June 5, 2013 at 2:21 pm


    I’ve got some code i’d like some help with but I can’t even get it to display in a black ‘code box’ on my post!

    What tags should I wrap my jquery in so it displays in a readable manner for forum members?


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

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed