我在jQuery中创建了一个函数,它允许我创建一个灯箱,如下所示:
var lightbox = create_lightbox(params);
我想扩展此功能,以便我可以添加自定义css,并使其在任何给定的环境中看起来像一种感觉。我希望能够做到这一点:
lightbox.css = {
"background-color" : "red",
etc...
}
这样做的最佳方法是什么?如何迭代我函数中的css元素?
tyvm
答案 0 :(得分:1)
创建函数以获取一个对象,其中包含要添加到灯箱的css属性中的所有值,然后使用jQuery的extend添加默认值。
function create_lightbox(params, css){
css = $.extend({ "background-color": "default val"}, css);
lightbox.css = css;
}
如果你真的想循环遍历css中的所有属性,你可以使用for in循环
function create_lightbox (params, css) {
css = $.extend({ "background-color": "default val"}, css);
for (cssKey in css)
lightbox.css[cssKey] = css[cssKey];
}
答案 1 :(得分:1)
只需使用CSS,因为应该使用CSS:在< style> -tag或链接的.css文件中。灯箱插件使用以下dom树;
<div id="jquery-lightbox">
<div id="lightbox-container-image-box">
<div id="lightbox-container-image">
<img id="lightbox-image" />
<div id="lightbox-nav">...</div>
</div>
</div>
</div>
然后设计你想要的风格。我想你不想在每个盒子上使用不同的款式吗?
答案 2 :(得分:0)
您可以向灯箱类添加元素属性,以便您可以修改构造函数中的值:
function lightbox() {
this.element = document.ccreateElement("div")
this.light = "light";
this.box = "box";
}
var newLightBox = new lightbox();
newLightBox.element.style.background = "#000";