Question

我有一个包含以下代码的PHP页面：

echo "function createimg() { var img = new Image();  img.src='path/to/image';  img.alt='Next image';  img.id = 'span1'; img.style.zIndex = 10;  img.style.position = 'absolute';  img.style.display='none'; img.style.top = '130px';  img.style.padding='10px'; img.style.left='440px';    img.className ='dynamicSpan';   document.body.appendChild(img); return img; }";

函数 createimg 在页面上的另一个图像加载时执行。

代码：someotherimage.load(createimg);

当鼠标悬停在'someotherimage'上时，会显示此创建的图像。

它闪烁！我无法将其嵌入到其他图像中！因此没有CSS精灵。

我似乎无法找到这个闪烁问题的解决方案，因为我似乎无法将事件处理程序附加到上面函数中创建的此图像，因此我可以抑制事件冒泡/定相！

有人帮帮我吗？

Ť

Answer 1

我认为这个问题出现在悬停图像（'someotherimage'）的事件传播中，因为过于频繁地生成鼠标事件。尝试平滑地改变可见性（不是立即使用display = block / none）。

最好使用jQuery，因为它还提供mouseover，mouseout和mousemove功能，您可以轻松地将其附加到您的图像。

jQuery示例：

$(document).ready(function() {
    $('.image').mouseover(function(e) {
        // show your element
    }).mousemove(function(e) {
        // move your element according to cursor
    }).mouseout(function() {
        // hide your element
    });
});

变量e.pageX，e.pageY包含鼠标坐标。

如果您不想使用jQuery，请尝试立即添加javascript超时而不是changin可见性（注意每次只添加1个超时）。

例如：

setTimeout("hide(elementIdOrSo)", 100);

如果我的回答对您没有帮助，请提供更多相关代码。

另外，请删除PHP标记（因为这个问题纯粹是与javascript相关的）而不是长内联echo调用会有一些换行符。

闪烁元素，未解决

1 个答案: