0

我想做到这一点：

当用户通过 Google Ad-words 进入我们的页面并打算通过浏览器中的后退按钮离开页面时，我想向他展示一个包含一些内容的渲染叠加层（“找不到要找的东西？打电话我们，我们会帮助你的！”......等等等等）。当然，用户可以关闭它并返回 Google。

当用户按下浏览器中的“后退”按钮时，是否有任何乳清来获取事件处理程序，以便我可以弹出自己的弹出窗口？:-)

另外：这不应该影响按下链接或重新加载页面。

来自德国的问候

4

1 回答 1

0

您需要创建一个 div 作为您的叠加层和一个包含您要向用户显示的信息的对话框。当你的事件被触发时，使用 jquery.show() 来显示覆盖和对话框。

你可以尝试这样的事情：

<html>
   <head>
      <style type="text/css">
           #fullscreen { display:none; position: fixed; z-index:500;  min-height: 100%;  min-width: 1024px;  width: 100%; height: auto; background-color: #565656; top:0; left:0px; margin:0; padding:0; opacity: .5;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=50)";  filter: alpha(opacity=50);}      
           #myDialog {display:none;}
      </style>
   </head>
   <body>
      <div id="fullscreen"></div>
      <div id="myDialog title="My Dialog Title" ></div>
   </body>

   <script type="text/javascript>
$(document).ready(function () {
    //When the user attempts to navigate away from the current page...
    $(window).unload(function () {
        $('fullscreen').show();

            $(function () {
                $("#myDialog ").dialog({
                    resizable: false,
                    closeOnEscape: false,
                    width: 660,
                    modal: true,
                    open: function (event, ui) {
                        //hide close button.
                        $(this).parent().children().children('.ui-dialog-titlebar-close').hide();
                    },
                    buttons: {
                        "OK": function () {
                            $(this).dialog("close");
                            $("fullscreen").hide();
                            window.location = "http://mypage.com";
                        },
                        "No, thanks": function () {
                            $(this).dialog("close");
                            $("fullscreen").hide();
                        }
                    }
                });
            });
       });
    });
});
</script>
</html>

然后执行任何需要的操作。如果您不熟悉 jQuery 的这些方面，我建议您查看对话框的文档：http: //jqueryui.com/dialog/

于 2013-10-23T15:14:46.763 回答