求css制作中的光标样式~~要可爱的才行……

html-css05

求css制作中的光标样式~~要可爱的才行……,第1张

自己制作个性鼠标

鼠标光标通常有两类:一是动画光标(*.ani),二是静态光标(*.cur).

制作软件很多.给你介绍两款:

一是ArtCursors, 一套极佳的鼠标光标编辑工具,支持标准的16x16、32x32及自订尺寸图示,除可观看、绘制、抓取、收集、和管理等功能外,亦有渐层着色功能及齐全的编辑工具。支持格式包括:ico、ani、cur、wmf、emf、bmp、jpg、jpeg、gif、png,它并从图像ICO、JPG等文件中导入。

你可以在以下网址下载到

http://download.pchome.net/design/icon/5898.html

只是该软件是英文界面.

二是值得推荐的: MicroAngelo 5.59C 汉化版.

这是一款功能强大的图标/光标制作和替换套装工具, 可以制作 .ico/.ani/.cur 光标, 还支持替换 Windows系统中的默认图标, 是您的系统更加个性化。还提供 .icl 图标库支持,可以自己建立/编辑/成立图标库文件。还有图标资源浏览器, 可以检测出包括图标资源的文件(比如 .exe/.dll/.cox/.cls/等等), 5.0 最大的优点是, 支持直接修改 .exe文件中的图标资源, 可以改您的应用程序换个图标。

下载地址:

http://soft.2118.com.cn/soft/5221.htm

transform 不会使DOM脱离文档流,当通过 translateX 等属性值移动了元素后,它仍然占据原来的位置。

好处是, transform 制作的动画会直接进入合成阶段,避开重排重绘,可以通过 Performance 录制面板来查看 transform 动画的效率。

MDN animation

深入浅出CSS动画

MDN animate()

监听 CSS animation 动画的事件:

这些监听事件对 animate() 是无效的。

页面顶部经常会见到水平无限轮播的公告。

由于轮播的内容是动态的,可能很多,也可能很少,如果公告内容的宽度没有超过最大宽度限制,那么就不应该轮播,如果超过了,则发起轮播。

假设我们永远只有一条最新的公告

原理:当一次动画执行结束时,影子内容的头部刚好对准轮播内容的初始位置,那么下次动画开始时,轮播内容将重新回到初始位置,由于影子内容与轮播内容相同,那么就给人造成一种无限轮播的错觉。

逻辑实现:父元素设置了 overflow: hidden ,又想要获取父元素、子元素的真实宽度,那么可以通过 scrollWidth 获取。

兼容性:如果不支持 animate() ,那么我们可以动态创建 <style>+ @keyframes ,插入 <head>, 但也要记得移除。