퐁당 웹 매거진 프로젝트 제작 일지 <13>

2023.12.04 (MON)

---

1. 검색 페이지 완성 및 라우팅

MySQL 데이터베이스와 연결하여, 검색 기능을 구현하였다.

---

그 중에서도 조금 오래걸렸던 부분은, 이 부분인데, 앞에 그라데이션 효과를 주면서 뒤에 요소를 클릭하게 만들고 싶었다.

.gradation_container > img {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
    pointer-events: none; /* 이미지 위에서의 이벤트 처리 막기 */
}

pointer-events를 none으로 설정하면, 이미지 위에서의 이벤트 처리를 차단할 수 있다.