我有一个小的缩略图库。当我将鼠标指针放在缩略图上时，我希望在屏幕右上角的 div 中弹出一个完整尺寸的图像。我已经看到只使用 CSS 完成了这项工作，如果可能的话，我想沿着这条路线走，而不是使用 javascript。
问问题
3663 次
4 回答
5
纯 CSS Popups2，来自为我们带来 Complexspiral 的同一站点。请注意，此示例使用实际导航链接作为翻转元素。如果您不希望这样，它可能会导致一些关于 IE 版本的粘性。
基本技术是将每个图像粘贴在带有实际 href 的链接标签内（否则某些 IE 版本将忽略：悬停）
<a href="#">Text <img class="popup" src="pic.gif" /></a>
并使用绝对位置巧妙地定位它。最初隐藏图像
a img.popup { display: none }
然后在链接翻转时，将其设置为出现。
a:hover img.popup { display: block }
这是基本技术，但由于图像标签位于链接标签内，因此总会存在主要的定位限制。详情见链接；他使用了比显示更棘手的东西：none 来隐藏图像。
于 2008-09-20T15:32:39.613 回答
1
CSS Playground使用纯 CSS 来处理这类事情，其中一个演示肯定会对您有所帮助，因为所有 CSS 都只是查看源代码来学习 - 您可能想使用 :hover 伪类，但它有一些限制，具体取决于您的浏览器定位。
于 2008-09-20T15:33:31.560 回答
0
Eric Meyer 的Pure CSS Popups 2演示听起来与您想要的非常相似。
于 2008-09-20T15:27:14.850 回答
0
于 2008-09-20T15:31:03.890 回答