×

앱 설치 안내

리빌더 공식 홈페이지 바로가기를 PC에 설치해보세요!
바탕화면에서 앱으로 실행할 수 있어요.

팁과노하우

2024.09.12 13:50

헤더 메뉴 흐림효과 추가 방법 (파일수정X)

현재 사이트를 입맛대로 수정하면서 꽤 괜찮네? 싶어서 올려봅니다...

현재는 스크롤을 하게되면 헤더메뉴에 컨텐츠가 비춰보입니다.


관리자페이지 > 기본환경설정 > 레이아웃 추가설정 > 추가 script, css에 아래 코드를 붙여 넣어주십시오.



<script>
    document.addEventListener('DOMContentLoaded', function() {
        var headerElement = document.getElementById('header');
        
        if (headerElement) {
            headerElement.style.backdropFilter = 'blur(10px)';
        }
    });
</script>



* 적용 전

27e4ca79039ce3542cea3c3ccda80633_1726118077_5384.png
 


* 적용 후 

27e4ca79039ce3542cea3c3ccda80633_1726118085_5793.png
 



* 적용 방법

27e4ca79039ce3542cea3c3ccda80633_1726116773_2926.png
 
  • 공유링크 복사
    미니홈 쪽지 구독하기
    구독하고 알림받기

    댓글목록

    profile_image
    HUMHAE미니홈 1:1 대화하기  오래 전

    이런 옵션을 사이드의 레이아웃 설정에서 할 수 있어도 좋을 것 같습니다...!

    2024-09-12 13:53

    profile_image
    April미니홈 1:1 대화하기  오래 전

    적용전과 적용후 차이를 잘못찾겠네요

    제가 노안이라서 그런가

    2024-09-12 14:08

    profile_image
    HUMHAE미니홈 1:1 대화하기  오래 전

    많이 차이가 안나기는 합니다 ㅎㅎ...
    그나마 좀 티가 나는거로 전후 사진을 다시 올려보았으니 확인 해보셔도 좋을 것 같습니다!

    2024-09-12 14:15

    profile_image
    no_profile 재아미니홈 1:1 대화하기  오래 전

    저도 보자마자 무슨 차이가 있지 하고 계속 위 아래 봤습니다. ㅎ 내 눈이 이상한가? 같은 이미지인가? 등등. ㅋ

    2024-09-12 21:07

    profile_image
    no_profile decoy미니홈 1:1 대화하기  오래 전

    스크롤 올리면서 배경이 좀 불투명했으면 하긴 했는데 블러값을 더 주니 많이 가려지네요
    감사합니다~

    2024-09-13 15:48

    profile_image
    펄스나인미니홈 1:1 대화하기  오래 전

    블러 효과네요~

    뒤에 비치는 부분이 약간 뿌옇게 됩니다
    처음에 빌더 기본이었다가 특정문제로 제거했는데 기억이....ㅠ

    그냥 비치는거보다는 고급스러움이 있습니다 ~
    댓글에 이미지 첨부하고싶어서 죽겠네요..

    빨리 업데이트 해야겠습니다 ㅎ

    2024-09-13 16:06