스크롤 크기 조정

Question

좀 jQuery를 작성했습니다

중첩 내 목적은 이것이다 : 화면 크기가 981보다 큰

경우, 내가 스크롤 이벤트를 추적하고 일부 CSS를 변경하고 싶어.

화면 크기가 981보다 작 으면 스크롤 이벤트를 추적하지 않고 간단히 CSS 스타일을 적용하기를 원합니다.

크기를 조정할 때이 조건을 확인하고 싶습니다.

내 jquery 코드는 아래에 있지만 크기를 조정할 때 크기를 조정할 때 너비가 981보다 작 으면 스크롤 이벤트가 계속 추적되고 그 안에있는 것들이 실행됩니다.

 $(window).on("resize", function() { 
var screenwidth = $(window).width(); 
if (screenwidth > 981) { 
    $(window).scroll(function() 
{ 
    var wintop = $(window).scrollTop(), docheight = $(document).height(), winheight = $(window).height(); 

    if (wintop>100) 
    { 
     //always in view 
        console.log('test100'); 
     $('#slider-top-box').css({ "position":"relative","margin-top":"70px" }); 
        $('#news-top-box').css({ "z-index":"1","margin-top":"-70px","background-color":"transparent","padding":"inherit" }); 
    } 
    else 
    { 
        $('#slider-top-box').css({ "position":"fixed","margin-top":"0px" }); 
        $('#news-top-box').css({ "z-index":"1","margin-top":"0px","background-color":"transparent","padding-top":"380px" }); 
    } 
}); 
} else { 
    $('#slider-top-box').css({ "position":"relative","margin-top":"0px" }); 
    $('#news-top-box').css({ "padding-top":"50px" }); 
}}).resize(); 

Answer 1

추적하지 않으려는 경우 이벤트 처리기를 삭제하십시오. 당신의 else 문에

사용 $(window).off("scroll");는 :

 $(window).on("resize", function() { 
var screenwidth = $(window).width(); 
if (screenwidth > 981) { 
    $(window).scroll(function() 
{ 
    var wintop = $(window).scrollTop(), docheight = $(document).height(), winheight = $(window).height(); 

    if (wintop>100) 
    { 
     //always in view 
        console.log('test100'); 
     $('#slider-top-box').css({ "position":"relative","margin-top":"70px" }); 
        $('#news-top-box').css({ "z-index":"1","margin-top":"-70px","background-color":"transparent","padding":"inherit" }); 
    } 
    else 
    { 
        $('#slider-top-box').css({ "position":"fixed","margin-top":"0px" }); 
        $('#news-top-box').css({ "z-index":"1","margin-top":"0px","background-color":"transparent","padding-top":"380px" }); 
    } 
}); 
} else { 
    $(window).off("scroll"); 
    $('#slider-top-box').css({ "position":"relative","margin-top":"0px" }); 
    $('#news-top-box').css({ "padding-top":"50px" }); 
}}).resize();