如何克服图像悬停中的这个问题？

在我的页面中，我想在网格视图中显示黑色&白色图像的列表，当我将鼠标悬停在此图像上时，它会显示彩色图像。当我将鼠标移开时，应该显示黑色的&白色图像。如何克服图像悬停中的这个问题？

当我点击一个特定的图像（例如，一个黑色的&白色图像）时，应该同时转为彩色图像，除此之外还应该添加刻度标记图像。

我用下面的脚本和HTML代码

SCRIPT

$(".swap_image").live('click', function() { 
if($(this).attr("class") == "swap_image") { 
    this.src = this.src.replace("_blackwhite", "_color"); 
    $('#tick_' + $(this).attr('rel')).show(); 
} else { 
    this.src = this.src.replace("_color", "_blackwhite"); 
    $('#tick_' + $(this).attr('rel')).hide(); 
} 
$(this).toggleClass("color"); 
return false;});

HTML

<img id="tick_{{img.id}}" src="{{MEDIA_URL}}img/tick.png" style="position:absolute;" ><a href="#"><img rel="{{img.id}}" src="{{MEDIA_URL}}{{ img.logo_blackwhite }}" onmouseover="this.src='{{MEDIA_URL}}{{ img.logo_color }}'" onmouseout="this.src='{{MEDIA_URL}}{{ img.logo_blackwhite }}'" class="swap_image" /></a>

我用上面的代码，一切工作正常，但是当我移动鼠标再次出现图像变黑&白色图像（因为我使用鼠标移开功能）

是否有任何其他更好的主意可用？或

如何克服这个问题？在此先感谢

来源

2012-10-11 BobDroid

'jQuery.live'在版本1.7中已弃用，您应该使用'jQuery.on'。 – Barmar

我建议您单击时向图像添加一个类。然后，当mouseout函数执行时，只需包含一个if/then，只有当该类不存在时才将图像交换回黑白。

来源

2012-10-11 06:29:12 CoderMarkus

当你点击图像，然后留下一些足迹。就像改变图像类，现在在你的鼠标移出功能检查条件，如果图像具有该特定的类或不。如果什么都不做，请改变图像的颜色。

来源

2012-10-11 06:34:58 mesimplybj

如何克服图像悬停中的这个问题？

回答

相关问题