Javascript 根据div的id更改其背景色

使用Scott Robbin的页面幻灯片：我试图制作“更多信息”幻灯片，从右到左覆盖整个屏幕

我得到了我想要的全屏幻灯片，但我希望能够定义每张幻灯片的背景色。这是在#页面幻灯片CSS上设置的，这对于每个幻灯片都是通用的

HTML:

JS:

/*
*jQuery页面幻灯片
*版本2.0
* http://srobbin.com/jquery-pageslide/
*
*jQueryJavaScript插件，将网页滑到另一个交互窗格上。
*
*版权所有（c）2011 Scott Robbin（srobbin.com）
*MIT和GPL许可下的双重许可。
*/
;
（职能（b）{
函数j（e，a）{
如果（0==e.indexOf（“#”）b（e）.clone（！0）.appendTo（c.empty（））.show（）；
否则{
如果（a）{
变量d=b（“”）.attr({
src:e，
帧边框：0，
hspace:0
}).css({
宽度：“100%”，
身高：“100%”
});
c、 html（d）
}否则c.载荷（e）；
c、 数据（“localEl”，！1）
}
}
函数k（b，a）{
var d=c.外径（！0），
f={}，g={}；
如果（！c.is（“：visible”）&&&！h）{
h=！0；
开关（b）{
案例“左”：
c、 css({
左：“自动”，
右：“-”+d+“px”
});
f[“左边距”]=“-=”+d；
g、 右=“+=”+d；
打破
违约：
c、 css({
左：“-”+d+“px”，
右：“自动”
})，f[“左边距”]=“+=”+d，g.left=“+=”+d
}
l、 制作动画（f，a）；
c、 show（）.为（g，a，函数（）制作动画{
h=！1
})
}
}
var l=b（“主体”），
c=b（“第页幻灯片”），
h=！1，
M
0==c.length&（c=b（“”）.attr（“id”，“pageslide”）.css（“display”，“none”）.appendTo（b（“body”））；
b、 fn.pageslide=功能（e）{
点击（功能a）{
var d=b（本），
f=b({
href:d.attr（“href”）
}，e）；
a、 预防默认值（）；
a、 停止传播（）；
c、 是（“：可见”）&&d[0]==m？b.pageslide.close（）：（b.pageslide（f），m=d[0]）
$（'body'）.css（'overflow-y'，'hidden'）；
})
};
b、 fn.pageslide.defaults={
速度:500,，
方向：“对”，
模态：！1，
iframe:！0，
href:null
};
b、 页面幻灯片=功能（e）{
var a=b.extend（{}，b.fn.pageslide.defaults，e）；
c、 是否（“：可见”）&&c.data（“方向”）！=a.direction？b.pageslide.close（功能）（）{
j（a.href，a.iframe）；
k（a.方向，a.速度）
})：（j（a.href，a.iframe），c.is（“：hidden”）&k（a.direction，a.speed））；
c、 数据（a）
};
b、 pageslide.close=函数（c）{
变量a=b（“第页幻灯片”），
d=a.外径（！0），
f=a.数据（“速度”），
g={}，i={}；
如果（！a.is（“：hidden”）&&&！h）{
h=！0；
开关（a.数据（“方向”））{
案例“左”：
g[“左边距”]=“+=”+d；
i、 右=“-=”+d；
打破
违约：
g[“左边距”]=“-=”+d，i.left=“-=”+d
}
a、 制作动画（i，f）；
l、 设置动画（g、f、函数（）{
a、 隐藏（）；
h=！1；
“未定义”！=c和c（）的类型
})
$（'body'）.css（'overflow-y'，'scroll'）；
}
};
c、 单击（功能（b）{
b、 停止传播（）
});
b（文档）。绑定（“单击键控键控”，功能（e）{
“keyup”==e.type&&27！=e.keyCode | | c.is（“：可见”）&&&c.data（“模态”）&&b.pageslide.close（）
})
})（jQuery）；

有没有办法根据div id（modal1、modal2、modal3）设置背景色

---

非常感谢

更改特定DIV标签的背景颜色，只需使用

background-color:#000000;

例如，这会将其设置为太黑。

我会使用jQuery

$('#YourDivid').css("background-color","black");

如果您想更改更多选项而不仅仅是背景色，那么您可以这样做

$('#YpurDivId').css({
    "background-color": "black",
    "border": "none"
});

---

谢谢你的回答。我已经试过了，但问题是幻灯片的背景是由#pagesile定义的，这在3张幻灯片中很常见。如何根据它的内容（可以是div#modal1、#modal2或#modal3）动态更改它？我尝试添加以下函数：

function bclick（color）{$（'#pageslide'）.css（“背景色”、“颜色”）；}

和以下调用：

但它不起作用。您是否尝试过：

bclick（color）{$（'#pagesile'）.css（“background color”，color）；}

？谢谢Fernando！就是这样！

$('#YourDivid').css("background-color","black");

$('#YpurDivId').css({
    "background-color": "black",
    "border": "none"
});