每次会话在网站上弹出一次 [英] Popup on website load once per session

问题描述

我找到了一些使javascript / jquery弹出窗口的方法。但是，有一些问题，首先，我对这两种语言不太熟悉，只是初学者。

如果有任何准备好的代码，打开POPUP窗口在网站加载，但每个浏览器会话只有一次。这将是非常好的，如果有人可以帮助我。

我需要一个简单的弹出窗口，只有一些文本，但弹出框设计好看，不像原来的浏览器弹出（如图像），当然，与关闭按钮。

http://i.stack.imgur.com/xNWxf.png

非常感谢

解决方案

我知道我不应该这样做，并且在没有您尝试先尝试的情况下为您提供答案，因为您不会学习这种方式。

但今天我感觉很好，所以我提供了一种在第一次加载时弹出并且不再加载弹出窗口的方法直到会话被销毁。

您需要设置会话，当您通过执行以下操作加载页面时：

  sessionStorage.setItem（'firstVisit'，'1'）; 
  

然后你只需要检查这样的会话：

如果没有会话称为 firstVisit ，则显示消息框

  if（！sessionStorage.getItem（'firstVisit'）===1）
 {
 $（。message）。show（）; 
} 
  

示例

HTML

 < div class =message> 
< div class =message_pad> 
< div id =message>< / div> 
< div class =message_leave> 
 
< / div> 
< / div> 
< / div> 
  

JavaScript / JQuery

  //将数据保存到sessionStorage 
 sessionStorage.setItem（'firstVisit'，'1'）; 
 $ b $ *修正文件准备就绪的大小* / 
 $（function（）
 {
 if（！sessionStorage.getItem（'firstVisit'）=== 1）
 {
 $（。message）。show（）; 
} 
 
 //关闭元素
 $（ （）; 
 $ b $（。message）。click（function（）
 {
 $（this）.hide（）; 
}）; 
 
 $ .css（{
'height'：$（document）.height（）+'px'
}）; 
 $（。message_pad）。css（{
 'left':( $（document）.width（）/ 2  -  500/2）+'px'
}）; 
}）; 
 / * 
 *修正调整大小的大小。 
 * / 
 $（window）.resize（function（）{
 $（。message）。css（{
'height'：$（document）.height （）+'px'
}）; 
 $（。message_pad）。css（{$ b $'left'：（$（document）.width（）/ 2  -  500 / 2）+'px'
}）; 
}）; 
  

JSFIDDLE

I found some ways to make javascript/jquery popup windows. But, there were some problems, first of all, I am not very good with these two languages, just beginner.

If there is any ready code, for opening POPUP window on website load, but only once per browser session. It would be very nice, if someone could help me with this.

I need simple popup, with just some text in it, but design for popup box something good looking, not like original browser popup (like in image), of course, with closing button.

http://i.stack.imgur.com/xNWxf.png

Thanks a lot

解决方案

I know I shouldn't really do this and provide you with the answer without you trying to attempt it first because you won't be learning that way.

But I'm feeling nice today, so I'm providing you of a way of doing a pop up on first load and not loading the pop again until the session been destroyed.

You need to set the session, when you load the page by doing the following:

sessionStorage.setItem('firstVisit', '1');

Then you just need to check for the session like this:

If there is no session called firstVisit then show message box

    if (!sessionStorage.getItem('firstVisit') === "1")
    {
       $(".message").show(); 
    } 

EXAMPLE

HTML

<div class="message">
    <div class="message_pad">
        <div id="message"></div>
        <div class="message_leave">

        </div>
    </div>
</div>

JavaScript/JQuery

// Save data to sessionStorage
sessionStorage.setItem('firstVisit', '1');

/* Fix size on document ready.*/
$(function()
{
    if (!sessionStorage.getItem('firstVisit') === "1")
    {
       $(".message").show(); 
    } 

    //Close element.
    $(".message").click(function()
    {
       $(this).hide();
    });

    $(".message").css({
        'height': $(document).height()+'px'
    });
    $(".message_pad").css({
        'left': ($(document).width()/2 - 500/2)+'px'
    });
});
/*
* Fix size on resize.
*/
$(window).resize(function(){
    $(".message").css({
        'height': $(document).height()+'px'
    });
    $(".message_pad").css({
        'left': ($(document).width()/2 - 500/2)+'px'
    });
});

JSFIDDLE

这篇关于每次会话在网站上弹出一次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！