JQuery disable a function when mobile view; and or when screen width is equal or less than 769px

Question

I have hover state on my JQuery which is this:

$('.navigation a').hover(
        function () {
            $(this).next('span').show();
        },
        function () {
            $(this).next('span').hide();
        }
    );

Now I want that hover state to disable whenever the user's screen resolution is 769px or lower.

So what is your particular question? You don't know how to get screen width? How to compare it with static value? — zerkms
– zerkms, Commented Jun 29, 2012 at 5:25
Do you mean you want the hover to disable and re-enable dynamically if the user changes the resolution while viewing your page (overkill, in my opinion), or just not bind the hover at all if the resolution is under your threshold at page load? Either way, try window.screen.width. — nnnnnn
– nnnnnn, Commented Jun 29, 2012 at 5:31
Just not bind the hover if the resolution is 769px and lower. — user1441816
– user1441816, Commented Jun 29, 2012 at 5:36

user1441816 · Accepted Answer · 2012-06-29 05:58:45Z

6

I found the answer.

if ( $(window).width() > 769) {
$('.navigation a').hover(
        function () {
            $(this).next('span').show();
        },
        function () {
            $(this).next('span').hide();
        }
    );
}

answered Jun 29, 2012 at 5:58

user1441816

8413 gold badges12 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

JQuery disable a function when mobile view; and or when screen width is equal or less than 769px

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related