Question

我创建了一个带有jquery的简单弹出窗口，基本上如果按下按钮，则显示＆＃39;显示＆＃39;来自＆＃39; none＆＃39;的变化阻止＆＃39;阻止＆＃39;在css中显示叠加层以使背景更暗。

请参阅我的代码：

function div_show() {
    $("#login").css({display:'block'});
    $("#overlay").css({background:'#000'});
    $("#overlay").css({zIndex:'2'});
}
//Function to Hide Popup
function div_hide(){
    $("#login").css({display:'none'});
    $("#overlay").css({background:'none'});
    $("#overlay").css({zIndex:'-1'});
}

弹出窗口本身（html）如果方便的话：

 <div id="overlay"></div>

    <button onClick="div_show()">Click me</button>

    <div id="login">
            <div id="loginpopup">
                stuff
            </div> 
    </div>

我希望有一个动画，比如褪色，当这个弹出窗口显示时，但我还没有管理它。我尝试将$("#login").fadeIn();添加到＆＃39; div_open（）＆＃39;功能，但这显然不起作用。

我希望有人可以帮助我。

非常感谢，

保

Answer 1

您应该使用引用here和here

的jQuery .show()和.hide()方法

然后，您可以使用jQuery的api轻松添加动画。

 $( "#login" ).show( "slow", function() {
      // Animation complete.
 });

如果要交替显示和隐藏，可能更容易使用引用here的.toggle()函数

如何将jquery动画应用于弹出窗口？

1 个答案: