JQuery Sticky navigation срабатывает, когда встречается определенное состояние

Question

Я успешно создал липкую навигацию и отлично работает. Тем не менее, я хочу, чтобы липкая навигация загорелась или запускалась, когда браузер меньше или равен 770px.

До сих пор это мой код

$j = jQuery.noConflict(); 

$j(document).ready(function() { 
    var navOffset = $j(".main-nav").offset().top; 
    var wi = $j(window).width(); 
    var sticky; 
    $j(".responsive-icon").wrapInner('<div class="value"></div>'); 
    $j(".main-nav").wrap('<div class="nav-placeholder"></div>'); 
    $j(".nav-placeholder").height($j(".main-nav").outerHeight()); 

    function stickyFunction() { /*Sticky navigation function*/ 
    sticky = $j(window).scroll(function() { 
       var scrollPos = $j(window).scrollTop(); 
       if (scrollPos >= navOffset) { 
       $j(".main-nav").attr("id", "fixed-menu"); 
       } else { 
       $j(".main-nav").removeAttr("id"); 
       } 
      }); 
    return sticky; 
    } 

    if(wi <= 770) { /* Suppose to Fires up immediately if the browser is lower than 770px */ 
     stickyFunction(); 
    } 
    $j(window).resize(function() { /*Suppose to fires up if the browser resize*/ 
    if(wi <= 770) { 
     stickyFunction(); 
    } 
    }); 
}); 

Как назвать stickyfunction для запуска, когда ширина браузера удовлетворяет условию?

Спасибо!

Answer 1

просто использовать липкий как событие прокрутки и попытаться использовать событие прокрутки в случае изменения размера окна так, ваша функция не обжигает в окне изменения размера .. использования этого

/*Sticky navigation function*/ 
    var stickyFunction= (function() { 
       var scrollPos = $j(window).scrollTop(); 
       if (scrollPos >= navOffset) { 
       $j(".main-nav").attr("id", "fixed-menu"); 
       } else { 
       $j(".main-nav").removeAttr("id"); 
       } 
      }); 

вместо

function stickyFunction() { /*Sticky navigation function*/ 
    sticky = $j(window).scroll(function() { 
       var scrollPos = $j(window).scrollTop(); 
       if (scrollPos >= navOffset) { 
       $j(".main-nav").attr("id", "fixed-menu"); 
       } else { 
       $j(".main-nav").removeAttr("id"); 
       } 
      }); 
    return sticky; 
    } 

и сделать событие для прокрутки окна

$j(window).on('scroll', stickyFunction); 

и изменить размер мероприятие

$j(window).on('resize',function() { /*Suppose to fires up if the browser resize*/ 
wi = $j(window).width();   
if(wi <= 770) { 
     stickyFunction(); 
    } 
    });