채택완료

재차 질문 드립니다.

2024-01-31 (수) 10:40:37 1,957

https://woosungent.com/ 보시면 우측에 따라다니는 div가 있습니다.

이미지 클릭시 div가 사라지게 하고 싶은데 그누에는 찾아봐도 없습니다.

간단하게 구현하는 방법이 있을까요?

도와주시면 감사하겠습니다.

소스 주시면 눈물 날거에요

2949054147_1706665224.7108.jpg

|

답변 2개 / 댓글 1개

채택된 답변
+20 포인트
2024-01-31 (수) 10:54:35

아래의 div 를 찾아서...

<div style="position: fixed; right: 12px; bottom: 450px;z-index:9999">

아래처럼 바꿉니다.

<div id="rightBox" style="position: fixed; right: 12px; bottom: 450px;z-index:9999">

그리고 버튼을 하나 만들어서 원하는 곳에 위치시킨 후

<button type="button" style="cursor:pointer" onclick="rightBox.style.display='none'">닫기</button>

열기 버튼은

<button type="button" style="cursor:pointer" onclick="rightBox.style.display='block'">열기</button>

----------

만일 토글버튼을 원하시면

<div id="rightBox" style="position: fixed; right: 12px; bottom: 450px;z-index:9999">

<button type="button" style="cursor:pointer" onclick="rightBoxToggle(this)">닫기</button>
<script>
function rightBoxToggle() {
    if (rightBox.style.display == "none") {
        rightBox.style.display = "block";
        arguments[0].innerHTML = "닫기";
    }
    else {
        rightBox.style.display = "none";
        arguments[0].innerHTML = "열기";
    }
}
</script>

답변에 대한 댓글 1개

2024-01-31 (수) 11:40:26
이미지에 이벤트를 걸수는 없나요?
2024-01-31 (수) 11:57:32

이미지입니다.

<div id="rightBox" style="position: fixed; right: 12px; bottom: 450px;z-index:9999">

<img src="닫기.jpg" style="cursor:pointer" onclick="rightBoxToggle(this)">
<script>
function rightBoxToggle() {
    if (rightBox.style.display == "none") {
        rightBox.style.display = "block";
        arguments[0].src = "닫기.jpg";
    }
    else {
        rightBox.style.display = "none";
        arguments[0].src = "열기.jpg";
    }
}
</script>

답변을 작성하려면 로그인이 필요합니다.