Include two conditions in an IF Statement

Hi I'm trying to include to conditions in a jQuerry if statement.

This is my current code with the bold being what I'm trying to make work.

// Add scrolling Nav Bar
$(document).ready(function() {
  var navpos = $('.nav-bar').offset();
  console.log(navpos.top);
    $(window).bind('scroll', function() {

      if ($(window).scrollTop() > navpos.top && $(window).width() < 960)) {

        $('.site-header .grid--full').hide(200);
        $('.nav-bar-scroll').show(200);
       }
       else {
         $('.site-header .grid--full').show(200);
         $('.nav-bar-scroll').hide(200);
       }
    });
});

if ($(window).scrollTop() > navpos.top && $(window).width() < 960)) {

My ultimate goal is to hide the original header and display a new one when scrolling down the page.

Thank you kindly in advance!