我正在尝试创建一个带有图像的简单鼠标悬停以显示提示或信息框/气泡。 我有一个包含图像 src 的 div 包装器,以及用于设置包装器和子项样式/位置的 css。 我只是不知道如何使 img src 具有交互性。 这是 html:
<div class="wrapper">
<img src="images/gallery/wheat3.png" width="250" height="250" data-stellar-ratio="3.5" data-stellar-vertical-offset="200">
</div>
我想创建一个带有图像“wheat3.png”的翻转显示和侧面的信息框。
这里还有测试链接: http://hatfielddesign.com/witbier_test/
谢谢。
最佳答案
查看您显示的测试链接的源代码,似乎他们使用了 Stellar.js来实现这个效果。阅读 docs , 他们可能会帮助你 ;)
关于CSS 信息框翻转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14736557/