javascript - 如何放置 :hover css in jquery and change image source

标签 javascript jquery css

我有 :hover 的 CSS。

我想使用 jquery 根据某些条件更改当前的 img 源,但我不知道如何添加悬停。

#ctrl_mm_e_0_0:hover{
    background-image: url("../images/dashboard_hover.png");
    background-size:55px 55px;
    background-repeat: no-repeat;
    height:70px;
    padding-left:280px;
    padding-top:50px;
    line-height: 0;
    width:70px; 
    font-size: 0;
    color: transparent;
    /*background-color:red; */    
}

这是我的 jquery,用于将当前图像更改为我使用的其他图像,但我不知道如何包含悬停:

var htmlElement = $('html').attr('lang');

if (htmlElement == 'ms'){
$(ctrl_mm_e_0_0).css({"background-image":"url(../Customizing/global/skin/images/dashboard_grey.png"});
}

如果系统更改语言,我会使用此代码。 html 标签是变化的:

<html lang="ms" dir="ltr"></html> -- other language
<html lang="en" dir="ltr"></html> -- main language

最佳答案

这个问题不需要 JS。您只需要扩展您的 CSS:

#ctrl_mm_e_0_0 {background-image: url(dashboard.png)}
#ctrl_mm_e_0_0:hover {background-image: url("dashboard_hover.png")}

html[lang="ms"] #ctrl_mm_e_0_0 {background-image: url("dashboard_ms.png")}
html[lang="ms"] #ctrl_mm_e_0_0:hover {background-image: url("dashboard_ms_hover.png")}

关于javascript - 如何放置 :hover css in jquery and change image source,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51034069/

相关文章:

javascript - 如何使用 JavaScript 文件调用 Grails Controller 的唯一方法?

当鼠标悬停在另一个函数创建的元素上时运行的 javascript 事件

javascript - 表单验证不同步

css - 使用 CSS 在 PDF 的每一页中添加页脚文本

javascript - 使用 css3 和 jquery 分别动画缩放和旋转

javascript - 在 JavaScript 中解析命名空间

javascript - 如何编写正则表达式从字符串方程中拆分两个连续的数学运算符( "/-"、 "*-")?

javascript - 鼠标滚轮事件检测当前在 Firefox 中不起作用

jquery - 一起使用 load() 和 after()

css - BXslider 全屏(调整浏览器窗口大小导致视觉错误)