/ / jqueryテーマ設定オプション - jquery、変数、テーマ、設定、オプション

jqueryのテーマ設定オプション - jquery、変数、テーマ、設定、オプション

このテーマを作成することで、私はいつものようにjqueryと苦労するのがかなり新しいです。

ちょうどこのチュートリアルを見て、自分のテーマ設定をカスタマイズしてカスタマイズを簡単にすることに決めました。

これは私がこれまで持っているものです:

(function($){

$.fn.themeSettings = function(options) {

var
slideshow = {
opacity: "0.5"
},
settings = $.extend({}, defaults, options);
};

var slideShowShadow = $("#slideShadowTop, #slideShadowBottom, #slideShadowLeft, #slideShadowRight");

slideShowShadow.css({
opacity: slideshow.opacity
});

})(jQuery);

私はまだそれに追加していないテーマで、現在のjqueryのすべてを台無しにしているので、どんな助けも素晴らしいだろう。

コードでは、私が達成しようとしているものを見ることができますが、明らかに私はjQueryを初めて使用しているので、どうやってそれをどうやって行くのか分かりません。

どんな助けでも大歓迎です、歓声

回答:

回答№1は0

あなたが今プラグインを設定している方法は、 slideShowShadow.css 割り当てようとしています slideshow.opacity ローディング時および themeSettings これは、 slideshow.opacity 〜される undefined。あなたがしなければならないのは、最後の数行を themeSettings 関数を呼び出すことによってプラグインをいくつかの要素に適用するときにそれらが実行されるようにします $("#your_elem").themeSettings()

(function($){
$.fn.themeSettings = function(options) {

var slideshow = {
opacity: "0.5"
},
settings = $.extend({}, slideshow, options),
slideShowShadow = $("#slideShadowTop, #slideShadowBottom, #slideShadowLeft, #slideShadowRight");

slideShowShadow.css({
opacity: settings.opacity
});
};
})(jQuery);

注:元の投稿は未定義の変数を参照しました(default) の中に $.extend 私はあなたがあなたのことを意図していたと確信しています slideshow オブジェクト。


回答№2の場合は0
$(function(){

var slideshow = {
opacity: 1,
corners: true,
shadows: true
},
xShadow = {
opacity: 0.5
};

// Slideshow Corners & Shadows
var $hWrap = $("#headerTopWrapper");

if(slideshow.corners){
$hWrap.prepend("<div id="slideCornersTop"></div>" + "n" +
"<div id="slideCornersBottom"></div>");
}

if(slideshow.shadows){
$hWrap.prepend("<div id="slideShadowTop"></div>" + "n" +
"<div id="slideShadowBottom"></div>" + "n" +
"<div id="slideShadowRight"></div>" + "n" +
"<div id="slideShadowLeft"></div>");
}


// Slideshow Shadow Opacity
var $slideShowShadow = $("#slideShadowTop, #slideShadowBottom, #slideShadowLeft, #slideShadowRight");

$slideShowShadow.css({
opacity: xShadow.opacity
});

});