使用jQuery切换事件

时间:2011-04-11 18:51:38

标签: javascript jquery jquery-ui html

我正在使用一些jQuery UI来切换屏幕上和屏幕外的div。在文档加载时,div对象在屏幕上。它工作得很好,但我想知道是否有办法设置它以便隐藏在文档加载上,然后用户可以单击按钮使其显示。

我尝试在document.ready上运行该功能,但这似乎不起作用。这是直接来自jQueryUI的代码。

$(function() {
        // run the currently selected effect
        function runEffect() {
            // get effect type from 
            var selectedEffect = "slide";

            // most effect types need no options passed by default
            var options = {};
            // some effects have required parameters
            if ( selectedEffect === "scale" ) {
                options = { percent: 0 };
            } else if ( selectedEffect === "size" ) {
                options = { to: { width: 200, height: 60 } };
            }

            // run the effect
            $( "#effect" ).toggle( selectedEffect, options, 500 );
        };

        // set effect from select menu value
        $( "#button" ).click(function() {
            runEffect();
            return false;
        });
    });

2 个答案:

答案 0 :(得分:3)

把它放在你的CSS中。这将默认设置为隐藏。

#effect{
 display:none;
}

答案 1 :(得分:1)

上面的CSS解决方案是正确的方法,但是如果你想用javascript做...

$(function() {
    $("#effect").hide();
});