添加CSS自定义可重复使用的功能

我创建了jQuery的一个功能，它可以让我建立一个灯箱如下：添加CSS自定义可重复使用的功能

var lightbox = create_lightbox(params);

我想扩大这个功能，所以我可以添加自定义CSS来它并使它看起来就像任何特定情况下的感觉一样。我宁愿能够做到如下因素：

lightbox.css = { 
    "background-color" : "red", 
    etc... 

}

什么是做到这一点的最佳方式，以及如何，我会遍历我的函数里面的CSS元素？

tyvm

来源

2011-12-11 vincent

创建你的函数取一个对象与所有你想要添加到您的收藏夹的CSS属性的值，然后加入您的默认值与jQuery的扩展。

function create_lightbox(params, css){ 
    css = $.extend({ "background-color": "default val"}, css); 

    lightbox.css = css; 
}

如果你真的想循环遍历所有的CSS属性，你可以在循环使用的

function create_lightbox (params, css) { 
    css = $.extend({ "background-color": "default val"}, css); 

    for (cssKey in css) 
    lightbox.css[cssKey] = css[cssKey]; 
}

来源

2011-12-11 19:45:14

只需使用CSS为CSS应使用：在<风格> - 标签或链接的.css文件。 lightbox插件使用以下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>

因此，然后风格你想要的风格。我想你不想在每个盒子上使用不同的风格？

来源

2011-12-11 19:52:53 Bergi

+1。在CSS没有问题的时候切勿使用JavaScript。 –

您可以将元素属性添加到收藏类，所以你可以修改值了构造：

function lightbox() { 
    this.element = document.ccreateElement("div") 
    this.light = "light"; 
    this.box = "box"; 
} 

var newLightBox = new lightbox(); 
newLightBox.element.style.background = "#000";

来源

2011-12-11 20:09:54

添加CSS自定义可重复使用的功能

回答

相关问题