css自定义鼠标,跨浏览器解决方案

1、纯要求自定义鼠标:

首先我们选一种能兼容各种浏览器的图标格式:cur。

css{

corsor:url(/*绝对路径针对ie*/),url(/*相对路径针对非ie*/),auto;

}

例如:

css{

corsor:url(/a.cur),url(../a.cur),auto;

}

这能满足基本的要求。

2、如果是要做成鼠标移到某个图片左边或者右边显示鼠标为箭头,这里会出现一点bug,在ie下。

假设我们的解决方案是这样的:

在一个容器(position为relative)里有三个元素:

a、图片;

b、点击图片左边的区域元素,这个元素是absolute的且宽度为50%,z-index也要高于a,left为0;

c、同b,right为0;

我们把b和c的样式设置为:

style="corsor:url(/a.cur),url(../a.cur),auto;"

会发现在ie下根本不出来。解决步骤:

a、把b和c的背景设为一个颜色后,发现在ie下图标出来了。

b、把b和c设置为全透明。

全透明的的示例代码:

.transparent_class {  filter:alpha(opacity=0);    -moz-opacity:0.0;   -khtml-opacity: 0.0;    opacity: 0.0;   }  

原文地址:https://www.cnblogs.com/tyhmj/p/2332335.html