使用CSS实现圈人效果(CSS Sprites)

• 本文地址: https://www.laruence.com/2009/05/05/740.html

我最早了解到"图片合并"技术, 应该是在大学游戏时代, 会发现很多游戏图标, 都会合并在一个位图中, 然后使用类似"遮罩"的技术来分别显示各种图标.
第一次使用CSS Sprites技术的时候, 其实并不知道它的这个名字, 也并没觉得多稀奇,就是个遮罩么.
今天玩开心网的圈人游戏时候, 发现它的实现是使用了Js, 突发奇想, 或许可以使用CSS Sprites来实现, 抛弃内嵌的JS.
效果如下:

图标标记

1. 显示器

17'的显示器哦~

2. 电话

听筒坏了

3. 机箱

白色的机箱

4. IBM ThinkPad

ThinkPad

5. 外置光驱

我不知道这玩意是哪里买的

有兴趣的同学, 可以直接看HTML源码, 一个独立页面的例子在这里