【问题标题】:jQuery leaveNotice plugin and internet explorerjQuery leaveNotice 插件和 Internet Explorer
【发布时间】:2011-07-19 01:06:52
【问题描述】:

我使用 leaveNotice 插件和作者 page 的示例(示例编号 6,最后一个)在网站上,chrome 和 ie8 看起来都很好。当我在我的页面中实现这一点时,在 chrome 中一切看起来都还可以,但是通常把它搞砸了。背景出现在文本下方,弹出窗口出现在背景下方。这可能是 css 的问题,但我没有 css 技能来修复它。加上示例站点上的相同 css 看起来一切都很好,我有点困惑,请帮助我。 这就是我的 html 中的内容

    <script language="javascript" type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
    <script language="javascript" type="text/javascript" src="js/jquery.leaveNotice.min.js">
    <script language="javascript" type="text/javascript" src="js/main.js"></script>
    <link rel="stylesheet" type="text/css" href="css/jquery.leaveNotice.css" />
    <link rel="stylesheet" type="text/css" href="css/main.css" />
  <a href="http://www.google.com" class="external_link">Google!</a>

我的 js 文件

$(document).ready(function () {
    $('.external_link').leaveNotice(
    {

        siteName:"LeaveNotice Test Page",
        exitMessage:"<h3>Say goodbye to {SITENAME}!</h3><p>Thanks. Shut the door behind you!</p>",
        preLinkMessage:"<hr/><p>Have fun at:<br/><strong>{URL}</strong></p><hr/>",
        overlayId:"custom-blackout",
        messageBoxId:"custom-messageBox",
        messageBoxHolder:"custom-messageHolder",
        overlayAlpha:0.6

    });

});

还有我的 CSS

#custom-blackout {position:fixed; top:0; left:0; width:100%; height:100%; background-color:#514004;}
#custom-messageHolder {position:fixed; top:200px; left:0; width:100%;}
#custom-messageBox {width:400px; margin:0 auto; padding:120px 50px 20px 50px; background:#333 url(img/custom-msg-box-bg.png) no-repeat top center; color:#fff; text-align:center; border:5px solid #F8DA07; -moz-border-radius:15px; -webkit-border-radius:15px;}
#custom-messageBox * {color:#fff;}
#custom-messageBox hr {border-color:#666;}
#custom-messageBox a#ln-cancelLink {background-color:#666; color:#333;}

【问题讨论】:

    标签: javascript jquery css internet-explorer jquery-plugins


    【解决方案1】:

    我在 IE8 上运行良好。

    我将整个示例连同示例中的样式表复制到 jsfiddle 中。您可以在 IE8 上打开以下链接进行测试:

    http://jsfiddle.net/neebz/gyjVg/1/

    我认为您的问题出在 CSS 上。您没有正确设置它的样式以显示它不够好。

    【讨论】:

    • 这很奇怪,还是不行,请在第一篇文章中检查我的代码
    • 肯定是找不到jQuery.LeaveNotice.css的问题。如果我从 jsfiddle 示例中删除 jQuery.LeaveNotice.css 的 css 链接并“运行”(Ctrl+Enter),那么我会遇到您提到的相同问题。您是否意识到在上面的代码中 css 文件是相对链接的?改成绝对链接看看。
    • 按照手册一步一步从头开始,所有浏览器都可以正常工作,除了ie :(
    • 好吧,我用 css 和 js 解决了问题,现在它可以工作了,不知道哪里出错了,但这显然是一个愚蠢的错误,谢谢帮助我找到它。
    猜你喜欢
    • 2010-10-09
    • 1970-01-01
    • 1970-01-01
    • 2011-03-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-02-18
    相关资源
    最近更新 更多