[英]How can I do a MouseOver of exact image shape?
The question below is not really a programming question, but more of "how can I do this" question, implementation advice. 下面的问题并不是一个真正的编程问题,而是更多的“如何做到这一点”的问题,实施建议。
I have an image of the world map. 我有一张世界地图的图像。 I can make each continent a separate image.
我可以使每个大陆成为一个单独的图像。
What I want to do is create a hover over feature for each continent. 我想要做的是为每个大陆创建一个悬停在功能上的功能。 When the users mouse is over the continent - the EXACT shape of the continent that is - I want it to change colour.
当用户鼠标在大陆上时 - 大陆的精确形状 - 我希望它改变颜色。
My main question is, how can I reference when the users mouse is over the exact shape of the continent? 我的主要问题是,当用户鼠标超出大陆的确切形状时,我该如何引用? I do not want to use Flash for this, all though I am afraid there is no other way to do this?
我不想为此使用Flash,虽然我担心没有其他方法可以做到这一点?
Thanks all 谢谢大家
The only way I know how to do this (without external libraries or js) is using <map>
. 我知道如何执行此操作(没有外部库或js)的唯一方法是使用
<map>
。 You will have to put in the coords and shape (in this case poly for the shape) to match the area you want to allow: http://www.w3schools.com/TAGS/tag_map.asp 您将必须放入坐标和形状(在本例中为形状的多边形)以匹配您想要允许的区域: http : //www.w3schools.com/TAGS/tag_map.asp
In answer to your main question, you'll probably need to use a good old image map. 在回答您的主要问题时,您可能需要使用旧的图像映射。 This image map generator has worked well for me in the past.
这张图片地图生成器过去对我来说效果很好。
As for making them change colors, you could always use a sprite and just change the background position of each country on hover? 至于让它们改变颜色,你总是可以使用精灵,只是在悬停时改变每个国家的背景位置?
You should look into this jQuery plugin: http://plugins.jquery.com/project/maphilight 你应该看一下这个jQuery插件: http : //plugins.jquery.com/project/maphilight
and theres a tutorial here: http://www.electricfairground.com/2009/08/08/image-map-rollover-effects-using-jquerys-maphilight-plugin/ 这里有一个教程: http : //www.electricfairground.com/2009/08/08/image-map-rollover-effects-using-jquerys-maphilight-plugin/
It depends on your platform (web, winform, linux, os x, etc.). 这取决于您的平台(web,winform,linux,os x等)。
On the web, you can use an image map. 在Web上,您可以使用图像映射。
On any OS-hosted application, you could do the equivalent of an image map using a region. 在任何OS托管的应用程序上,您可以使用区域执行等效的图像映射。 Or you could even test the color of the pixel over which you are hovering.
或者你甚至可以测试你正在悬停的像素的颜色。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.