我遇到this网站,并且想要实现类似于图片更改徽标的事情,同时鼠标正在移入我自己的网站。我不确定它是否使用jQuery作为页面源代码有点令人困惑,有没有办法让我在javascript中做到这一点?在javascript中移动mousemove上的图片
0
A
回答
0
如果你有一个div或者其他的block元素而不是图片标签,你也可以使用css来实现同样的效果。
#logo {
background: url('logo.png');
width: 200px;
height: 45px;
}
#logo:hover {
background: url('logo_hover.png');
}
1
实际上,该网站使用背景子画面,并显示每个标志变更子画面的位置。
这是标志精灵形象: http://w00tmedia.net/wp-content/themes/w00t/images/citrus-logos.png
你应该做的基础上,精灵布局一些计算,以及如何快速“”你想改变形象。
看到这, http://docs.jquery.com/Tutorials:Mouse_Position
,然后更改元素的背景位置。
+0
Sprites会做,这里不需要JS。 – 2013-02-28 20:23:27
+0
Sprites还具有附加的优点,即所有图像都是“预加载”的,因为只有一个大图像,而不是具有不同的图像,这将导致新加载的图像闪烁一段时间,直到它们完全加载。 – DanC 2013-02-28 20:34:41
相关问题
- 1. 在mousemove上移动背景图像
- 2. 在mousemove上移动缩放图像
- 3. Semplice-向网站添加Javascript;在mousemove上移动背景图像
- 4. 纯Javascript如何放大图片在mousemove?
- 5. 用JavaScript移动图片
- 6. 在vb.net的图片框上移动点
- 7. 在C中移动图片#
- 8. 图片向上移动
- 9. Javascript:控制图片的移动速度
- 10. 用于移动的Javascript图片库
- 11. picturebox中的移动图片
- 12. 背景图片在移动设备上
- 13. 图像在IE10中的mousemove上旋转
- 14. 在javascript中的图像上mousemove箭头时出错?
- 15. Javascript,移动按钮上的特定图片点击
- 16. 移动设备上的图片库
- 17. 移动图片上的文本
- 18. 如何在运行时移动mousemove上的控件?
- 19. 追加的元素在mousemove上移动不灵活?
- 20. 在其他元素的mousemove上移动svg视口
- 21. 图片在网页上滚动时在网页上移动
- 22. 在javascript画布上移动图像
- 23. 通过捕获MouseUp和MouseMove在图片框中的图像上绘制图像(拖动并绘制图像)
- 24. 移动图片ontouch
- 25. FancyBox iframe中的图片在移动设备上无法响应
- 26. 如何在编辑器中自由移动上传的图片?
- 27. jQuery - 用于移动设备的mousemove
- 28. JavaScript webdriver-selenium mouseMove在铬上不准确?
- 29. 如何在div中移动图片?
- 30. 在Pygame中移动时替换图片
使用jQuery鼠标悬停事件来更改图像的src – 2013-02-28 20:06:27
有关如何执行此操作的实际实现可能超出了此处答案的范围。 – DanC 2013-02-28 20:11:43