سلام دوستان میخواستم کد جاوایی بهم بدید که با jquery.min کار کنه و برای هر کاربر فقط یک بار این باکس رو به نمایش بزاره به وسیله Cookie:
بعد از بستن این باکس با کلیک روی دکمه
اون باکس رو ببنده و این باکس رو برای 5ثانیه به نمایش بزاره:
میخوام فقط یکبار این دوتا کار رو کاربر بکنه و برای رفرش های بعدی دیگ هر بار این باکس ها به نمایش در نیان
دوستانی که تو جاوا اسکریپت مهارت دادن ممنون میشم کمکم کنند
کد:
<style>
.mypopup {
/*display: none; for demonstration*/
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
overflow-x: hidden;
overflow-y: auto;
z-index: 2000;
}
.mypopup-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
z-index: 2001;
}
.mypopup-wrapper {
position: relative;
top: 50%;
width: 600px;
height: 400px;
margin: auto;
background-color: #FFF;
border-radius:25px;
border:3px solid #f7941d;
z-index: 2002;
transform: translateY(-50%);
}
@media only screen and (max-width: 600px) {
.mypopup-wrapper {
width: 88% !important;
max-height: 85% !important;
top: 7%;
transform: none !important;
}
}
.mypopup-close {
position: absolute;
top: 5px;
right: 5px;
width: 30px;
height: 30px;
background: #f7941d;
color:#FFF;
border: 1px solid;
-webkit-border-radius: 100px;
border-radius: 100px;
cursor:pointer
}
button.mypopup-close:hover{
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
opacity: 1;
}
.mypopup-content-1 {
float:right;
width: 50%;
}
.mypopup-content-2 {
float:left;
width: 50%;
height:100%;
border-bottom-left-radius:20px;
border-top-left-radius:20px;
background:#f7941d
}
<div class="mypopup">
<div class="mypopup-overlay"></div>
<div class="mypopup-wrapper">
<button class="mypopup-close">✖</button>
<div class="mypopup-content-1 box shadow">
بازاریابان در حال بالا بردن سرمایه گذاری خود در زمینه محتوا هستند، اما برای تاثیرگذاری بهتر تغییرات، آنها بایستی زمان و تلاش لازم را برای آموختن قوانین جدید سئو نیز بگذارند. به گفته کارشناسان، دوران انتقال ترافیک به سایت به کمک headlineهای آماده و کلمات کلیدی مدت هاست که گذشته است، و استراتژی جدید سئو بر اساس حوزه پول ساز دیگری بنام تحلیل و تجربه نهادینه شده است.
</div>
<div class="mypopup-content-2 box shadow">
بازاریابان در حال بالا بردن سرمایه گذاری خود در زمینه محتوا هستند، اما برای تاثیرگذاری بهتر تغییرات، آنها بایستی زمان و تلاش لازم را برای آموختن قوانین جدید سئو نیز بگذارند. به گفته کارشناسان، دوران انتقال ترافیک به سایت به کمک headlineهای آماده و کلمات کلیدی مدت هاست که گذشته است، و استراتژی جدید سئو بر اساس حوزه پول ساز دیگری بنام تحلیل و تجربه نهادینه شده است.
</div>
</div>
</div>
</style>بعد از بستن این باکس با کلیک روی دکمه
کد:
<button class="mypopup-close">✖</button>اون باکس رو ببنده و این باکس رو برای 5ثانیه به نمایش بزاره:
کد:
<div class="mypopup-2">
<div class="mypopup-overlay"></div>
<div class="mypopup-wrapper-2">
<button class="mypopup-close-2">✖</button>
<div class="mypopup-content-3"></div>
</div>
</div>
<style>
.mypopup-2 {
/*display: none; for demonstration*/
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
overflow-x: hidden;
overflow-y: auto;
z-index: 1999;
}
.mypopup-wrapper-2 {
position: relative;
top: 50%;
width: 600px;
height: 400px;
margin: auto;
z-index: 2002;
transform: translateY(-50%);
}
@media only screen and (max-width: 600px) {
.mypopup-wrapper-2 {
width: 88% !important;
max-height: 85% !important;
top: 7%;
transform: none !important;
}
}
.mypopup-close-2 {
position: absolute;
top: 5px;
right: 5px;
width: 30px;
height: 30px;
color:#FFF;
border: 1px solid;
-webkit-border-radius: 100px;
border-radius: 100px;
cursor:pointer
}
button.mypopup-close-2:hover{
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
opacity: 1;
}
.mypopup-content-3 {
float:right;
position:relative;
background:url(images/welcome.png) no-repeat;
top:30%;
right:15%;
width:500px;
height:70px;
}
</style>میخوام فقط یکبار این دوتا کار رو کاربر بکنه و برای رفرش های بعدی دیگ هر بار این باکس ها به نمایش در نیان
دوستانی که تو جاوا اسکریپت مهارت دادن ممنون میشم کمکم کنند
