在鼠标悬停时创建动态图像

Question

当用户将鼠标悬停在某个事物上时，我想创建一个图像。我想要一些关于我通过 javascript 动态创建的图像的数据。在这里附上我需要做的图片，...

我希望在悬停时显示目标图像。知道我该如何继续吗？

Answer 1

我猜你正在寻找带有图像的工具提示。试试这些例子。

http://craigsworks.com/projects/qtip2/

http://calebjacob.com/tooltipster/

http://plugins.learningjquery.com/cluetip/

http://cssglobe.com/easiest-tooltip-and-image-preview-using-jquery/

http://www.1stwebdesigner.com/css/stylish-jquery-tooltip-plugins-webdesign/

http://vandelaydesign.com/blog/tools/jquery-tooltip-scripts/

Answer 2

您可以尝试使用 jQuery 的“悬停”方法并从回调函数的事件参数中捕获鼠标位置。然后附加一个新的绝对定位的 div 并使用您从鼠标位置获取的顶部和左侧参数位置设置它的样式。添加您需要在弹出窗口中显示的任何信息，并将其附加到新创建的 div 中。

Answer 3

你有现成的代码吗？

你也可以试试

:hover

http://www.w3schools.com/cssref/sel_hover.asp 和

:after

http://www.w3schools.com/cssref/sel_after.asp 和内容属性

Answer 4

函数在javascript中：

function showIt(imgsrc)
{
document.getElementById('imageshow').src=imgsrc;
document.getElementById('imageshow').style.display='block';
}

function hideIt()
{
document.getElementById('imageshow').style.display='none';
}