jqueryからCSSブロックのプロパティにアクセス

Question

私はJavaScriptをベースにしたサイトを持っていますが、CSSで簡単に変更できるようにしたいと考えています。
この例を取っ​​てください... jQueryをホバリングしたときに不透明度が変更されたdivがありますが、デザイナーが不透明度の値を選択できるようにしたいと思います。
私は例えば、ちょうどこの定数を宣言するために、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を使用することができ

：あなたが述べたように、それはより良好に維持することができる、ため、CSSクラスとしてそれらを定義する

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

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

Answer 2

は良い方法です。

しかし、私はあなたが単一のCSS constantsクラスから個々のプロパティを引き出すべきではないと思います。代わりに複数のを意味のあるクラスに定義し、それらをjQueryを使用して追加/削除します。例えば

、個別のCSSを動的に追加するためのクラス：

.faded-out { 
    opacity: 0.5; 
} 

.highlight { 
    background: yellow; 
} 

し、関連のjQuery：

jQuery('.someElements').addClass('faded-out'); 
jQuery('.otherElements').removeClass('highlight'); 

Answer 3

@lonesomdaysソリューションは明白1、及びその時良いものです。 ここは私のものです。 getConfig('constants_someid','opacity')

作業フィドル使用し、それを呼び出すために

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

：http://jsfiddle.net/5GWHU/