이미지 title 말풍선 안 보이게 할려면 채택완료
다조아해
5년 전
조회 1,971
일반 페이지에서 사진을 클릭하면
팝업창으로 큰 사진이 나오면서 alt와 title 값을 뿌려서 내용이 보이게 하고 있습니다.
그런데 클릭할 사진에 마우스를 올리면 말풍선으로 title 값이 보이는데 이 말풍선을 안 보이게 하는 소스나 css가 있을까요?
<a class="" href="main/use1-1.jpg" alt="외관" title="사진을 클릭하면"><img class="img-responsive" alt="" src="main/use1-1.jpg"> </a>
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
5년 전
* 자바스크립트를 이용해 툴팁을 띄우지 않는 방법들
- https://stackoverflow.com/questions/5762244/disable-tooltips-using-css
로그인 후 평가할 수 있습니다
답변에 대한 댓글 2개
�
다조아해
5년 전
B
BiHon
5년 전
여러 방법이 있는데 어떤 방법이 안된다는 것인지 모르겠네요.
간단하게 아래처럼 </body> 전에 스크립트를 추가해보세요.
[code]
<script>
document.querySelectorAll('a[href]').forEach(el => {
el.setAttribute('data-title-cache', el.textContent.trim() || el.getAttribute('href'));
el.setAttribute('title', el.getAttribute('data-title-cache'));
el.addEventListener('mouseenter', (e) => {
el.setAttribute('title', '');
});
el.addEventListener('mouseleave', (e) => {
el.setAttribute('title', el.getAttribute('data-title-cache'));
});
});
</script>
</body>
[/code]
간단하게 아래처럼 </body> 전에 스크립트를 추가해보세요.
[code]
<script>
document.querySelectorAll('a[href]').forEach(el => {
el.setAttribute('data-title-cache', el.textContent.trim() || el.getAttribute('href'));
el.setAttribute('title', el.getAttribute('data-title-cache'));
el.addEventListener('mouseenter', (e) => {
el.setAttribute('title', '');
});
el.addEventListener('mouseleave', (e) => {
el.setAttribute('title', el.getAttribute('data-title-cache'));
});
});
</script>
</body>
[/code]
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
했는데 잘 안되네요