Sayfa yüklendikten sonra açılıp otomatik kapanan popup uygulaması

Sayfa yüklendikten sonra açılıp otomatik kapanan popup uygulaması yapalım. Sayfa açılışı tamamlandıktan sonra her ziyaretçiye bir kere açılan cookieli lightbox popup açtıralım ve daha sonra kendimiz belirleyeceğimiz süre sonunda kapanmasını söyleyelim. Resim Olarakta en altta görebilirsiniz.

DEMO İÇİN TIKLAYINIZ

1. Olarak alttaki Kodları sitemizin <head>BURAYA </head> tagları arasına yerleştirelim.

<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<link type="text/css" href="js/basic.css" rel="stylesheet" media="screen" />
<!--[if lt IE 7]>
<link type="text/css" href="js/basic_ie.css" rel="stylesheet" media="screen" />
<![endif]-->
<link type="text/css" href="js/gg_fb.css" rel="stylesheet" media="screen" />
<script type="text/javascript" src="js/jquery.simplemodal.1.4.1.min.js"></script>

2. olarak alttaki kodları <body>BURAYA </body> tagları arasında her hangi bir yere yapıştırabilirsiniz

<script type="text/javascript">
		var sure = 10 ;   //  Geri sayım sayacının başlayacağı rakam
		function Kontrol() {
			sure = sure-1;
			$("span#1").text(sure); // <span id="1"> </span> olan yerde geri sayım yapacaktır
			if( sure > 0 )  setTimeout("Kontrol()", 1000);
		}
if(GetCookie('cerez') !== 'milat' )
	{
		jQuery(document).ready( function()
		{
			kapat = (sure-1)*1000 ;
			jQuery('.gg-fb').modal({minWidth:"600"}); // Popup burda açılıyor
			Kontrol();
		    setTimeout(function(){ $.modal.close('.gg-fb');  }, kapat ); // Popup burda kapanıyor
			SetCookie('cerez','milat',1);  // cerez olusturduk her ziyaretçiye bir kere açılması için
		});
	}
</script>
<div style="display: none;">
<div class="gg-fb">
<img src="js/yorum_yaz.png" alt="" width="600" height="320" />
<div class="fb-div"><strong> <span id="1" style="color: #ff0000;"> </span> Saniye sonra Kapanacaktır</strong></div>
</div>
</div>

Kapanacak süreyi ise “var sure = 10 ;” yazan kısımdaki süreyi kendinize göre belirleyin


 Bu yazımda ise otomatik olarak kapatma değilde kendimizin kapattığı yazımızı okuabilirsiniz.


Eğer siz Farklı Birsey Yazmak istiyorsanız <div class=”gg-fb”> Burası </div> Değiştirmeniz gerekmekterdir..

Çalışma Dosyasını İndir

Lightbox




Yorumlar (7)
Sende Bir Cevap Yazsan Ne Olurdu Ha Ne Olurdu

Isim (Zorunlu)

Website