我在移动设备上测试前面教程的图表实例时发现,当手指点击图表出现ToolTip时,图表容器的会出现一个半透明的高亮背景。设备浏览器不一样,颜色也不一样,很是影响交互效果。试了一下用Javascript来移除,花了一天时间也没弄出来,最后不得不Google了,又花了几个小时,终于用CSS3搞定了。
代码如下:
-webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-user-select: none; -moz-user-focus: none; -moz-user-select: none;
新加了禁止选择文本的功能。其中,前二句对WebKit内核浏览器(Safari、Chrome、iPhone、iPad、Android等)有效,后二句对Gecko内核的浏览器(Firefox等)有效。
看来真该花些时间学学CSS3了。