코스모스팜 스레드
헤더 메뉴 아이콘 클릭시 배경색상 변경
1. 정확한 제품 또는 플러그인 이름
워드프레스 엘레멘터 빌더
2. 상세 내용
안녕하세요.
모바일 메뉴 토글 아이콘 클릭시 헤더 전체 배경색상을 흰색으로 변경관련 문의하였는데 4번의 css 코드를 안내받고 적용하였습니다.
그런데 클릭시 헤더 전체 배경색이 변경되는 것이 아닌, 클릭 전에도 그냥 픽스되어 헤더 배경 전체가 흰색으로 변경이 되어버립니다.
헤더 아이콘 클릭시와 클릭후에만 색상 변경 되게끔 설정할 수 있는 css코드가 있을까요?
감사합니다.
3. 확인 가능한 상세 페이지 주소
https://cleanb.life/
-이미지 링크 : https://imgur.com/fsOGrL2
4. 수정한 코드 내역 (이전 문의에서 전달받았)
.elementor-2358 .elementor-element.elementor-element-7bd89b3:not(.elementor-motion-effects-element-type-background), .elementor-2358 .elementor-element.elementor-element-7bd89b3 > .elementor-motion-effects-container > .elementor-motion-effects-layer{ background-color: 원하는 색; }
-
스레드봇 AI 2023.07.05 13:57
AI에 의해 자동 생성된 답변이에요 😀
안녕하세요,
헤더 메뉴 아이콘 클릭 시 배경색상을 변경하는 방법에 대해 문의하셨는데, 제공해주신 코드를 살펴보니 헤더 전체 배경색이 클릭 전에도 흰색으로 변경되는 문제가 발생하고 있습니다. 원하시는 것은 클릭 전에는 배경색이 변경되지 않고, 클릭 후에만 변경되는 것이 맞나요?
현재 제공된 코드는 헤더 전체에 적용되어 클릭 여부와 상관없이 항상 흰색으로 변경되는 것으로 보입니다. 따라서, 클릭 전에는 배경색이 유지되도록 코드를 수정해야 할 것 같습니다.
다음과 같이 코드를 수정해보세요:
.elementor-2358 .elementor-element.elementor-element-7bd89b3:not(.elementor-motion-effects-element-type-background) {
background-color: 원하는 색;
}
.elementor-2358 .elementor-element.elementor-element-7bd89b3 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
background-color: 초기 배경색;
}
위의 코드에서 "초기 배경색"에는 헤더의 기본 배경색을 입력해주세요. 이렇게 수정하면 클릭 전과 클릭 후에 서로 다른 배경색이 적용될 것입니다.
위의 코드를 적용해보시고 문제가 해결되는지 확인해보세요. 추가로 궁금한 점이 있으면 언제든지 물어보세요. 도움이 되었기를 바랍니다. 감사합니다.
↓ 아래 버튼을 눌러서 피드백해주세요.
