CSS 미디어 쿼리 및 스크롤바
반응형 웹 디자인 영역에서 미디어 쿼리는 다양한 화면 크기에 콘텐츠를 적용하는 데 매우 유용한 도구입니다. 그러나 특정 브라우저에서는 스크롤바 및 미디어 쿼리를 처리할 때 문제가 발생할 수 있습니다.
Firefox에서 스크롤바를 사용할 때 이러한 문제 중 하나가 발생합니다. 제공된 바이올린에서 알 수 있듯이 화면 크기가 800px 미만으로 줄어들면 미디어 쿼리가 예상대로 실행되지 않는 문제가 사용자에게 발생했습니다.
mqGenie로 문제 해결
이 문제를 해결하기 위해 mqGenie JavaScript 라이브러리와 관련된 솔루션이 등장했습니다. 이 라이브러리는 뷰포트 너비를 계산할 때 스크롤바 너비를 고려하는 브라우저의 CSS 미디어 쿼리를 조정합니다.
mqGenie를 프로젝트의
에 통합하면 사용자는 미디어 쿼리가 의도한 화면 크기에 관계없이 실행되도록 보장할 수 있습니다.mqGenie의 이점
mqGenie를 채택하면 여러 가지 이점을 얻을 수 있습니다.
구현
mqGenie를 구현하려면 다음에서 라이브러리를 다운로드하면 됩니다. 공식 웹사이트(http://stowball.github.io/mqGenie/). 다운로드한 JavaScript 파일을
문서에 따라 프로젝트를 호출합니다.위 내용은 다음은 질문-답변 형식을 염두에 두고 몇 가지 제목 옵션입니다. 옵션 1(문제에 집중): * 스크롤 막대가 나타날 때 Firefox에서 내 미디어 쿼리가 중단되는 이유는 무엇입니까? 옵션 2(다음에 중점을 둡니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!