답변 2개
채택된 답변
+20 포인트
4년 전
스크롤된 값을 빼줘야 하는데 깜빡한 모양이네요
top: (e.pageY - $(window).scrollTop()) + "px", left: (e.pageX - $(window).scrollLeft()) + "px"
</p>
<p><body style="width: 5000px; height: 5000px;">
<!-- 마우스 커서 -->
<div class="cursor_wrap">
<div class="cursor"><span class="circle"></span></div>
</div></p>
<p><script>
$(window).on("mousemove", function(e) {
$(".cursor").css({
top: (e.pageY - $(window).scrollTop()) + "px",
left: (e.pageX - $(window).scrollLeft()) + "px"
});
$('a, select, label, input, button, .tabs li').hover(function() {
$('.cursor').addClass('mouse_hover');
}, function(){
$('.cursor').removeClass('mouse_hover');
});
});
</script></p>
<p><style>
.cursor_wrap {position: absolute; left: 0; top: 0; width: 30px; height: 30px; pointer-events: none; z-index: 10000; }
.cursor_wrap .cursor {position: fixed; }
.cursor_wrap .cursor .circle { display: block; opacity: 0.15; background-color: red; width: 30px; height: 30px; border-radius: 50%; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; transform: translate(-50%, -50%) matrix(1, 0, 0, 1, 0, 0);}
.cursor_wrap .cursor.mouse_hover .circle { background-color: rgb(127, 127, 127); transform: translate(-50%, -50%) matrix(3, 0, 0, 3, 0, 0); }
</style>
</body></p>
<p>
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
김태후니
4년 전
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
갓블레스유.
당신은 최고입니다.