Opcje ustawień motywu jQuery - jquery, zmienne, motywy, ustawienia, opcje

Tworząc ten motyw, jestem całkiem nowy jak jquery i jak zwykle walczę.

Po obejrzeniu tego samouczka postanowiłem zrobić własne ustawienia kompozycji, aby uprościć personalizację.

Oto, co mam do tej pory:

(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);

Każda pomoc byłaby świetna, ponieważ zepsułoby to cały obecny jquery na temat, którego jeszcze nie dodałem.

Myślę, że według kodu można zobaczyć, co próbuję osiągnąć, ale oczywiście ponieważ jestem nowy w jQuery, nie jestem pewien, jak to zrobić.

Każda pomoc byłaby doceniona, wiwaty

Odpowiedzi:

Sposób, w jaki masz teraz zainstalowaną wtyczkę, slideShowShadow.css próbuje przypisać slideshow.opacity w czasie ładowania i poza zakresem themeSettings funkcja, co oznacza, że slideshow.opacity będzie undefined. Wszystko, co musisz zrobić, to przenieść kilka ostatnich linii do themeSettings działają tak, że są uruchamiane po zastosowaniu wtyczki do jakiegoś elementu przez wywołanie $("#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);

Uwaga: Twój oryginalny wpis odwołuje się do niezdefiniowanej zmiennej (default) w $.extend funkcja, którą jestem pewien, że zamierzałeś być slideshow obiekt.

$(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
});

});