[英]Snap a custom cursor back to the center of the mouse after a size increase?
我有一个自定义 cursor 使用一些 CSS - 在 hover 上更改大小。 尺寸增加后,将 cursor 卡回鼠标中心的最佳方法是什么?
这是小提琴: https://jsfiddle.net/fojn8bq9/
这是我最初用来将 cursor 居中的 JavaScript:
const w = myCircle.offsetWidth / 2;
const h = myCircle.offsetHeight / 2;
const myMouse = new (function() {
this.follow = function(event) {
myCircle.style.left = event.pageX - w + 'px';
myCircle.style.top = event.pageY - h + 'px';
};
})();
将 ^it 装入我的 hover function 的最佳方法是什么?
$(document).ready(function(){
$("button").hover(function(){
$(myCircle).css({"height":"50px", "width":"50px"});
}, function(){
$(myCircle).css({"height":"25px", "width":"25px"});
});
});
您可以将圆移动新旧高度/宽度之间差异的一半:
$("button").hover(function(){ $(myCircle).css({"height":"50px", "width":"50px", transform: "translate(-12.5px, -12.5px)"}); }, function(){ $(myCircle).css({"height":"25px", "width":"25px", transform: ""}); }); });
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.