jQuery模块窗口不工作

谢谢你看我的代码和问题！jQuery模块窗口不工作

我对此很新，所以请原谅我对jQuery的知识缺乏！

我想创建一个“电子邮件注册”窗口。我希望它在几秒钟后淡入并调暗背景。然后用户将输入他们的电子邮件或点击取消。然后模块窗口会消失，页面将恢复正常。

我无法从头开始创建，所以找到了一个名为SimpleModal的东西，我正在使用该代码。我从这个网站得到： http://www.ericmmartin.com/projects/simplemodal/

我可以让窗口模块出现在页面上，但就是这样。相反，我希望它淡入淡出背景。

你可以在这里看到完整的页面： http://halloweenseattle.com/faq_test.php

预先感谢您。我真的非常感谢你的帮助。今天早上我已经花了几个小时在这个上面了！

来源

2014-08-28 Andrea

我认为这应该这样做：

$("#showBtn").click(function() { 
    $("#emailPopup").modal({ 
     overlayId: 'overlay', 
     overlayClose: true, 
     onOpen: function (dialog) { 
      dialog.overlay.fadeIn('slow', function() { 
       dialog.container.slideDown('slow', function() { 
        dialog.data.fadeIn('slow'); 
       }); 
      }); 
    }}); 
}); 
$('#cancelBtn').click(function() { 
    $.modal.close(); 
});

这里工作demo。没有意识到巨大的脚本，我没有设法将插件包括在内。基本上，你应该使用onOpen回调做动画。请参阅documentation中的回调部分，第一个示例。

编辑：

由于您使用jQuery UI的，我建议使用dialog plugin。它更容易使用，你不必包括其它脚本和CSS：

$("#emailPopup").dialog({ 
    autoOpen: false, 
    modal: true, 
    show: { 
     effect: "fade", 
     duration: 500 
    }, 
    hide: { 
     effect: "fade", 
     duration: 500 
    } 
}); 
$("#showBtn").click(function() { 
    $("#emailPopup").dialog("open"); 
}); 
$('#cancelBtn').click(function() { 
    $("#emailPopup").dialog("close"); 
});

这里被更新demo。

来源

2014-08-28 17:10:36

嗨@Ilya！我仍然对某事感到困惑。有没有可以写更多的地方？此框将它限制在一定数量的字符中。我没有看到我的代码更改可以回复您的位置..？谢谢！ – Andrea 2014-08-28 19:35:39

@Andrea你可以更新你的问题更多细节 – 2014-08-28 19:38:50

我会把我的新代码放在原来的盒子里（它有更多的空间来插入我的代码）。 – Andrea 2014-08-28 19:40:20

jQuery模块窗口不工作

回答

相关问题