태그 보관물: user-interface

user-interface

사용자 정의 웹킷 스크롤 막대를 비활성화하는 방법이 있습니까? 브라우저에서 스크롤 막대의 사용자 정의를

Chrome과 같은 웹킷 기반 브라우저에서 스크롤 막대의 사용자 정의를 비활성화하거나 되돌릴 수있는 확장, 사용자 정의 사용자 스타일 시트 등이 있습니까? 나는 평범한 기본 스크롤 막대를 좋아하지만 CSS로 스타일이 지정되면 CSS 조합을 찾지 못합니다.



답변

불행히도 일단 활성화되면 CSS를 “비활성화”하거나 되돌릴 수 없습니다.

::-webkit-scrollbar는 기본 스타일을 얻기 위해 단순히 재정의 될 수 없으며, 코드에서 모든 ::-webkit-scrollbar 규칙을 제거하는 것이 유일한 방법입니다. 이때 스크롤 가능 영역을 스크롤 막대를 다시 그리도록 강제해야합니다. 그렇게하려면 디스플레이를 빠르게 추가하고 제거하십시오. overflow : hidden;에서 동일한 작업을 수행하거나 수행합니다. 스크롤 가능한 요소에. 첫 번째 문제는 페이지를로드 할 때마다 페이지가 흰색으로 깜박 인다는 것입니다. 두 번째 요소는 페이지의 요소가 오버플로되어 이상적이지 않은지 확인해야하기 때문에 리소스를 많이 사용합니다.

위의 링크는 사용자 지정 막대를 완전히 제거하여 스크롤 막대가없는 스크립트에서 가져온 것입니다.


답변

바이너리 클린 텍스트 편집기 또는 16 진 편집기에서 웹 브라우저 실행 파일을 열고 “webkit-scrollbar”를 “webkit-scrollb4r”과 같은 다른 정크로 바꿉니다. 방금 Chrome을 사용 하여이 문제를 해결했습니다.


답변

// ==UserScript==
// @name         My Fancy Scrollbar Userscript
// @namespace    http://your.homepage/
// @version      0.1
// @description  enter something useful
// @author       You
// @match        http://*/*
// @grant        none
// ==/UserScript==

[].forEach.call(document.styleSheets, function(sheet) {
    for (var i = 0; i < sheet.rules.length; ++i) {
        var rule = sheet.rules[i];
        if (/::-webkit-scrollbar/.test(rule.selectorText)) {
            sheet.deleteRule(i--);
        }
    }
});


답변