Forum PHP.pl > [JavaScript] Popup

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript] Popup - delay i close

TomToma

14.02.2013, 23:37:45

Cześć, mam problem z popupem który pojawia się po każdej poprawnie wykonanej aktualizacji strony. Problem polega na tym, że mam dwie opcje zamykania tego popup'a, czasową ( zamykanie po 3 sekundach ) oraz po kliknięciu na "Zamknij" każda z nich osobno działa dobrze, ale jak włączę "delay" to przestaje mi działać "close". Może po prostu źle kombinuje z tym delay w jaki inny sposób to rozwiązać żeby okno zamykało się po 3 sekundach.

[HTML] pobierz, plaintext 
<script type="text/javascript">
	$(document).ready(function() {
		$('#popup_name').fadeIn().delay(2000).fadeOut().css({  }).prepend('<a class="close" href="#"><img class="btn_close" title="Zamknij okno" src="images/cms/popup_close.png" alt="Zamknij" /></a>');
		var popMargTop = ($('#popup_name').height() + 80) / 2;
		var popMargLeft = ($('#popup_name').width() + 80) / 2;
		$('#popup_name').css({'margin-top' : -popMargTop,'margin-left' : -popMargLeft});
		$('body').append('<div id="fade"></div>');
		$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn().delay(2000).fadeOut();
		$('a.close, #fade').live('click', function() {
			$('#fade , .popup_block').fadeOut(function() {
				$('#fade, a.close').remove();
			});
		});	
    });
</script>
[HTML] pobierz, plaintext

kamil_lk

14.02.2013, 23:45:43

Cześć.
A może użyj gotowej biblioteki http://trentrichardson.com/Impromptu/
Z tego co tam piszą to jest poza standardowym 'zamknij' opcja wyłączenia popupa po upłynięciu określonego czasu.

Poniżej kod, który wywołuje popupa, który wyłącza się po 3 sekundach oraz z przyciskiem 'zamknij (x)'

[HTML] pobierz, plaintext 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="jquery-impromptu.js"></script> <!-- biblioteka pobrana z podanej stronki -->
<link rel="stylesheet" media="all" type="text/css" href="styles.css"> <!-- stle pobrane z powyższej stronki -->
<script type="text/javascript">
$(window).load(function() {
	$("button.popup").bind(
 
		'click', function(){
			$.prompt('asdasd',{ overlayspeed: 2, buttons: {}, title: 'Jest zajebiście', timeout: 3000 });
		}
 
	);
});
</script>
</head>
 
<body>
<button class="popup">POPUP</button>
</body>
</html>
[HTML] pobierz, plaintext

https://raw.github.com/trentrichardson/jQue...ry-impromptu.js - biblioteka
https://raw.github.com/trentrichardson/Moop...urce/styles.css - style

luke18dg

15.02.2013, 00:50:33

Cytat(TomToma @ 14.02.2013, 23:37:45 )

Nie czytałem kodu, nie znam się tyle na javiescript, żeby się o niej wypowiadać, ale z punktu czysto programistycznego pewnie wciskasz jakąś funkcje, która odpowiada za opóźnienie.
Ale czy nie łatwiej zrobić to na czasie? Pobrać czas lokalny i sprawdzać warunkiem czy minął czas jeśli tak ma zniknąć, jeśli nie ma dalej być.
Krzyżyk to spełnienie dodatkowego jakiegoś warunku dołączonego do warunku powyżej.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.