Question

我有一个严重基于javascript的网站，但我仍然想让它很容易被CSS修改举个例子......有一个div，它在悬停在jQuery时修改了它的不透明度，但我希望设计师能够选择不透明度的值。
我正在考虑在css中创建一个块来声明这个常量，例如：

.constants_someid{
  opacity: 0.5;
}

然后通过jQuery我将这种不透明度视为

 var opacity = jQuery('css:constants_someid').attr('opacity');

我不知道这是否是做这些常量声明的好方法，但这就是现在想到的。

你们怎么想？

谢谢，
乔

Answer 1

在Javascript文件中定义它们：

var settings = {
    opacity: 0.5
};

这种语法应该足够容易让设计师修改。然后，您可以将其用作settings.opacity。

然后，您可以使用$.extend将设计器定义的设置与默认设置合并：

var defaults = {
    opacity: 0.9,
    speed: 500
}

settings = $.extend({}, defaults, settings);
// returns { opacity: 0.5, speed: 500 }

Answer 2

@lonesomdays解决方案是显而易见的，并且是一个很好的解决方案。这是我的看法;

function getConfig(className,property)
{
    var dummy = $('<span class="' + className + '" />');
    var value = dummy.appendTo('body').css(property);
    dummy.remove();
    return value;
}

要使用getConfig('constants_someid','opacity')

来调用它

工作小提琴：http://jsfiddle.net/5GWHU/

Answer 3

将它们定义为CSS类是一种很好的方法，因为正如您所提到的，可以更好地维护它。

但是，我不认为您应该从单个CSS constants类中提取单个属性。而是定义多个有意义的类，并使用jQuery添加/删除它们。

例如，用于动态添加的各个CSS类：

.faded-out {
   opacity: 0.5;
}

.highlight {
   background: yellow;
}

从jquery访问css块的属性

3 个答案: