Question

专家;

我有一个照片修饰组合页面，其中缩略图图像交换了主要查看器图像。主要的观众图像是一个具有前后的精灵。在部分之后，在修饰之前显示原始图像，并在润饰之后。精灵作为背景图像加载到主查看器div中，设置为在鼠标悬停时重新定位以显示精灵的前后部分。

当页面最初加载时，主查看器的行为应该如此，显示出之前和之后。在悬停时的位置转换后。但是，一旦将新图像加载到查看器中，通过缩略图选择，悬停操作就会停止工作。我已经在这里工作了几个小时，无法解决问题。

主视图精灵的一个例子可以在这里看到： http://www.triadimedia.com/frame_01.jpg。所有款式和款式脚本包含在页面中，在这里： http://www.triadimedia.com/pfolio_photo_retouch.php。

非常感谢任何帮助。

感谢。

凯西

Answer 1

更改拇指以使用此代码：

<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;
}

无论如何，

为我做了快速测试。

Pseudo Class Hover在JavaScript ImageSwap中不起作用

1 个答案: