Question

我有一个脚本，当您将鼠标悬停在某些单词上时会显示图像。在脚本的一个不可见的部分，我查询我的数据库中的所有这些名称，并为它们提供一个范围。像这样：<span>Word from my database</span>.

但是，我遇到的问题是文本也会占用所有这些css属性，因此单词会向右/向左移动。我希望文本不会移动，但是当你将鼠标悬停在这些单词上时仍会显示图像。如果有一个jquery类允许我编辑单独的css类，我认为这将是一个简单的修复 - 但我完全没有想法。我也试过在jquery中使用hover函数，但我遇到了类似的问题。

我的jquery代码只是查找包含数据库名称的span，然后将鼠标悬停时的css样式应用于span并删除mouseout上的样式。

$( "span:contains('" + names + "')" ).mouseover( 
    function() {
        $(this).css("display", "inline");
        $(this).css("background-image", "url('" + link2 + "')");
        $(this).css("position", "absolute");
        $(this).css("width", "307");
        $(this).css("height", "465");
        $(this).css("z-index", "100");
    })

$( "span:contains('" + names + "')" ).mouseout( 
    function() {
        $(this).css("display", "");
        $(this).css("background-image", "");
        $(this).css("position", "");
        $(this).css("width", "");
        $(this).css("height", "");
        $(this).css("z-index", "");
    })

使用jquery和css在鼠标上显示图像

0 个答案: