테스트 사이트 - 개발 중인 베타 버전입니다

div 스크롤시 페이지도 같이 스크롤되는 문제

ㅎㅅ 4년 전 조회 5,522

</p>

<p>div#side_left{</p>

<p>width:60%;</p>

<p>height:800px;</p>

<p>background-color:white;</p>

<p>float:left;</p>

<p>margin-top:30px;</p>

<p>margin-left:3%;</p>

<p>}</p>

<p>

 

Css 는 다음과 같습니다.

해당 div 내부에 스크롤이 가능한 div 가 하나 더 있는데

해당 div 를 스크롤할 때 페이지도 같이 스크롤되는 문제가 있습니다.

어떤 식으로 해결해야하나요 ?

 

검색해서 시도해본것은 hover 를 이용해 해당 div에 마우스 커서가 올라가면 body 의 스크롤을 없애버리려고 합니다.

</p>

<p>$("div#side_left").hover(</p>

<p>function () {</p>

<p>$('body').css('overflow','hidden');</p>

<p>},</p>

<p>function () {</p>

<p>$('body').css('overflow','auto');</p>

<p>}</p>

<p>);</p>

<p>

다음과 같으나 정상작동되지 않습니다.

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

네온쌓인

div하나더 감싸서 나누시는건 어떠신가요

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

Big1
4년 전

height 도 주셔야 합니다

</p>

<p><script>

$('#side_left').hover(

    function() {

        $('html,body').css({

            overflow: 'hidden',

            height: '100%'

        });

    },

    function() {

        $('html,body').css({

            overflow: 'auto',

            height: 'auto'

        });

    }

);

</script></p>

<p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

ㅎㅅ
4년 전
동일하게 넣어도 작성이 안되네요 .. hover를 쓰기위해 import 해줘야하는 것이 있나요 ?
ㅎㅅ
4년 전
해당 #side_left 에서 스크롤시
Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/6662647093133312
와 같은 문구가 뜨는데 이것이 영향이 있을까요 ?

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인