当有人访问我的网站时,如何更改光标指针并在其上应用css

时间:2017-04-21 15:28:42

标签: javascript jquery html css

我是网站开发人员,我想知道是否可以在鼠标光标上应用一些css 。我知道我们可以使用cursor:pointer;,它会将标准箭头转换为点击手(通常显示链接)。

但我真正想要的是,如果有人访问我的网站,那么他的鼠标光标会变成红色某些阴影会出现在它周围或类似的东西。我不确定它是否可能,这可能是一个非常愚蠢的问题,所以提前抱歉。如果有可能那么我想知道,怎么样?我的问题很简单,任何帮助都非常感激。

*注意:如果可以使用javascript或jquery,那么我也不介意使用它们。

由于

3 个答案:

答案 0 :(得分:2)

不,你不能改变原生游标的行为或风格,但对于你的功能,你有几个选择:

首先:pointer css属性不仅有cursor,还有很多其他值。您可以查看它们here

其次:您可以提供用作光标的图像。在这种情况下,您必须了解浏览器兼容性,但它可能是您的选择:

cursor: url('path-to-image.png'), auto;

另一种选择可能是使用cursor: none并使用某种跟随用户鼠标位置的DOM元素。这可能不是你想要的方式,我不会推荐它(因为它只是感觉hacky并且对性能产生负面影响)但是它绝对是可能的。

以下是该选项的示例(摘自css-tricks.com): http://codepen.io/tamm/pen/LIFam

答案 1 :(得分:1)

是的,你可以这样做:

body {
  cursor:url('/img/yourimage.png'), auto;
}

答案 2 :(得分:0)

这是我将您链接到

的codepen的分叉版本

http://codepen.io/hoonin_hooligan/pen/wdGVeG

你显然必须通过传统的CSS修改内容,以制作你的游戏"但是这样可以防止你必须将光标创建为图像并允许你拥有动画等。

 #follower
 position absolute
 top 50%
 left 50%
 #circle1
   position absolute 
   border-top 10px solid transparent
   border-bottom 10px solid transparent
   border-left 15px solid red
   height 0em
   width 0em
   margin-top 0em
   margin-left 0em
相关问题