我可以根据光标位置更改按钮位置吗?
Can I change button position depending on the cursor position?
我是 javascript 的新手,所以不幸的是我还不知道其中的正确命令。
所以我有这段代码,带有一个滚动回顶部的按钮,我想知道是否有办法根据光标的位置更改该按钮的位置?例如,如果光标位于站点的右侧,则按钮出现在右侧。
代码长了我不指望你自己写,你能告诉我需要用到什么命令就够了,那我自己试试
我感谢任何帮助!
<button onclick="topFunction()" id="topB" title="Go to top">Top</button>
#topB {
display: none;
position: fixed;
bottom: 20px;
right: 30px;
z-index: 99;
border: none;
outline: none;
background-color: gray;
color: white;
cursor: pointer;
padding: 15px;
border-radius: 10px;
font-size: 18px;
}
#topB:hover {
color:black;
background-color: red;
}
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
// After scrolling down "number"px, the button appears
if (document.body.scrollTop >= 10 || document.documentElement.scrollTop >=
10) {
document.getElementById("topB").style.display = "block";
} else {
document.getElementById("topB").style.display = "none";
}
}
function topFunction() {
// Scrolls to the top on click
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
使用鼠标悬停事件并获取指针的 x 和 y 坐标。现在使用 window.innerWidth 获取屏幕的总宽度 现在使用指针的 x 位置确定我是哪个半指针并相应地更改 css。如果你需要更多帮助,我可以帮助你
我是 javascript 的新手,所以不幸的是我还不知道其中的正确命令。 所以我有这段代码,带有一个滚动回顶部的按钮,我想知道是否有办法根据光标的位置更改该按钮的位置?例如,如果光标位于站点的右侧,则按钮出现在右侧。 代码长了我不指望你自己写,你能告诉我需要用到什么命令就够了,那我自己试试
我感谢任何帮助!
<button onclick="topFunction()" id="topB" title="Go to top">Top</button>
#topB {
display: none;
position: fixed;
bottom: 20px;
right: 30px;
z-index: 99;
border: none;
outline: none;
background-color: gray;
color: white;
cursor: pointer;
padding: 15px;
border-radius: 10px;
font-size: 18px;
}
#topB:hover {
color:black;
background-color: red;
}
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
// After scrolling down "number"px, the button appears
if (document.body.scrollTop >= 10 || document.documentElement.scrollTop >=
10) {
document.getElementById("topB").style.display = "block";
} else {
document.getElementById("topB").style.display = "none";
}
}
function topFunction() {
// Scrolls to the top on click
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
使用鼠标悬停事件并获取指针的 x 和 y 坐标。现在使用 window.innerWidth 获取屏幕的总宽度 现在使用指针的 x 位置确定我是哪个半指针并相应地更改 css。如果你需要更多帮助,我可以帮助你