Question

创建这个主题，我对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的新手，我不知道该如何去做。

任何帮助都会非常感激，欢呼声

Answer 1

您现在设置插件的方式，slideShowShadow.css正在尝试在加载时分配slideshow.opacity且在themeSettings函数范围之外，这意味着{{1}将是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对象。

Answer 2

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

});

jquery主题设置选项

2 个答案: