我正在尝试创建一个简单的交互式图像映射,用户可以将鼠标指针悬停在图像的一部分上,然后设置将动画/显示/取消隐藏弹出框(不是新的)窗口!)鼠标指针的当前位置旁边包含文本,图像和& |可点击的链接。
然而,在该示例中,它不是图像地图,而是9个小图像。悬停在上方时,每个图像都会变得更大,单击时,会将图像加载到页面的右<div>
。
我希望满足这些标准:
我不确定使用什么平台(又名 - 开发工具的混合)来满足上面的标准列表。主要目标是满足上述标准列表中的最后一项。如果需要做的是为了满足最后一项,我可能会牺牲上面列表中的第一个或第二个标准。
我想要使用的几个“平台”是:
我应该使用哪些工具来解决这个问题?
我是否缺少一种不同的工具或工具集应该使用而不是上面列出的工具?
提前致谢!
<小时/> 编辑:如果您投票结束此操作,请将我的问题重定向到已经涵盖此问题或请不要关闭它!这个问题是可以回答的 - 这不是讨论。
答案 0 :(得分:5)
在直接HTML / CSS (不需要JS)中实现这一点非常简单,这将是最广泛使用的方法。这是一个简单的例子:
您可以根据需要使弹出内容变得复杂 - 这是一个相当基本的示例,但您可以在列表项中使用任意HTML。此外,您可以在一些CSS3动画中添加过渡效果,这些动画在您喜爱的现代浏览器上看起来很漂亮。