PHP Ionic Angular HTML5 AJAX Javascript CSS MySQL jQuery Forum


สร้างกล่องแจ้งข้อความ คล้าย MSN ด้วย jQuery

01 February 2009 By Ninenik Narkdee
jquery ข้อความ msn

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ jquery ข้อความ msn



<script language="javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript">
$(function(){
	$("div#popupbox").click(function(){ // สำหรับคลิกเพื่อปิด
		$(this).hide();
	});
	var IDPop=setTimeout("iPopUp()",3000); // กำหนดให้แสดงหลัง 3 วินาที
	$(window).resize(function(){ // กรณีมีการกำหนดขนาดหน้าต่างบราวเซอร์
		var popup_y=$(window).height()-$("div#popupbox").height()-3;
		var popup_x=$(window).width()-$("div#popupbox").width()-3;		
		$("div#popupbox").css({
			top:popup_y,
			left:popup_x
		});
	});
});
function iPopUp(){ // ฟังก์ชันแสดง popup
	var popup_y=$(window).height()-$("div#popupbox").height()-3;
	var popup_x=$(window).width()-$("div#popupbox").width()-3;		
	$("span").html(popup_x+"  "+popup_y);
	$("div#popupbox").css({
		top:popup_y,
		left:popup_x
	});
	$("div#popupbox").show();
	setTimeout("iPopUpHide()",5000); // กำหนดให้ปิดเองภายใน 5 วินาที
}
function iPopUpHide(){
	$("div#popupbox").hide();
}
</script>
<style type="text/css">
div#popupbox{
	width:175px;
	font-size:12px;
	color:#336699;
	height:120px;
	background:url(images/bg_popup.gif) no-repeat left top;
	position:fixed;
	display:none;
	text-align:center;
	cursor:pointer;
}	
</style>
<div id="popupbox">
<br />
<br />
<br />
<p>สวัสดีครับ</p>
</div>

สามารถนำไปประยุกต์ใช้งานได้

คลิกดูตัวอย่าง



อย่าลืมกด Like กด Share เป็นกำลังใจ ในการสร้างบทความใหม่ๆ น่ะครับ



บริการเว็บ server web hosting
บริการเว็บ server web hosting


Tags:: jquery ข้อความ msn







URL สำหรับอ้างอิง