伪类悬停赢得'；不能在JavaScript ImageSwap中工作

专家

我有一个照片润饰组合页面，有缩略图图像交换出主查看器图像。主查看器图像是一个sprite，它有一个Before&After部分，在对原始图像进行修饰之前和修饰之后显示原始图像。精灵作为背景图像加载到主查看器div中，设置为在鼠标悬停时重新定位，以显示精灵的前后部分

当页面最初加载时，主查看器将按其应有的方式运行，在悬停时显示前后位置的移动。但一旦通过缩略图选择将新图像加载到查看器中，悬停操作将停止工作。我已经做了几个小时了，解决不了这个问题

此处可以看到主viewr精灵的示例： . 页面中包含所有样式和脚本，如下所示：

任何帮助都将不胜感激

谢谢

---

凯西

更改拇指以使用此代码：

<a onclick="javascript:thumb_swap(1);"></a>
<a onclick="javascript:thumb_swap(2);"></a>

等等

然后将当前所有JS函数替换为以下函数：

function thumb_swap(num) {
    if(num<10) num = "0"+num;
    var el = document.getElementById('viewer');
    var styles = getComputedStyle(el,null);
    var bgurl = styles.backgroundImage;
    bgurl = bgurl.replace(/_[0-9]+\.jpg/,'_'+num+'.jpg');
    document.getElementById('viewer').style.backgroundImage = bgurl;
}

功能拇指交换（num）{
如果（num）您是否尝试将函数附加到
mouseover
和
mouseout
？我认为您的代码不起作用，因为您已经完成了innerHTML，我认为您应该尝试设置div的背景图像