สอบถามปัญหาการทำระบบ Notify Alert ข้อความใหม่ หรือ Notification แบบ Outlook (PHP,MySQL)

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามปัญหาการทำระบบ Notify Alert ข้อความใหม่ หรือ Notification แบบ Outlook (PHP,MySQL)

สอบถามปัญหาการทำระบบ Notify Alert ข้อความใหม่ หรือ Notification แบบ Outlook (PHP,MySQL)
มันแจ้งว่าไม่รองรับอ่ะครับ
 
ขนาดรันใน chrome แล้วน่ะครับ
 
พอจะมีวิธีแก้ไหมครับ


Natjadee 110.164.182.xxx 20-07-2014 23:18:00

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ


  • ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1
ตรวจสอบว่ารองรับ notification มั้ย ถ้าไม่ใช่ webkit ไม่รองรับ 

แต่ถ้าเป็น chrome ต้องไปตั้งค่า ใน settings ก่อน

Settings » Advanced settings » Privacy settings » Content settings » Notifications.

ตัวอย่างโค้ดที่ทำงาน หลังเปิด การใช้งานใน chrome แล้ว

<style type="text/css">
.myButton {
	-moz-box-shadow: 0px 10px 14px -7px #276873;
	-webkit-box-shadow: 0px 10px 14px -7px #276873;
	box-shadow: 0px 10px 14px -7px #276873;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
	background:-moz-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-webkit-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-o-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:-ms-linear-gradient(top, #599bb3 5%, #408c99 100%);
	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
	background-color:#599bb3;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:arial;
	font-size:20px;
	font-weight:bold;
	padding:13px 32px;
	text-decoration:none;
	text-shadow:0px 1px 0px #3d768a;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #408c99), color-stop(1, #599bb3));
	background:-moz-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-webkit-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-o-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:-ms-linear-gradient(top, #408c99 5%, #599bb3 100%);
	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#408c99', endColorstr='#599bb3',GradientType=0);
	background-color:#408c99;
}
.myButton:active {
	position:relative;
	top:1px;
}

</style>

<script>
function notify() {
  if (!window.webkitNotifications) return;  // ตรวจสอบว่ารองรับ notification มั้ย ถ้าไม่ใช่ webkit ไม่รองรับ
  var havePermission = window.webkitNotifications.checkPermission();
  if (havePermission == 0) {
    // 0 is PERMISSION_ALLOWED
    var notification = window.webkitNotifications.createNotification(
      'http://www.ninenik.com/images/logo_01_Tue.gif',  // รูปภาพ ประกอบ
      'หัวข้อที่ต้องการแสดง!',
    'รายละเอียด ข้อความ'
    );
    
    notification.onclick = function () {
		// url ลิ้งค์ เมื่อคลิกที่ notification 
      window.open("http://www.ninenik.com");
    }
    notification.show();
  } else {
      window.webkitNotifications.requestPermission();
  }
}  
</script>


<a href="javascript:notify();" class="myButton">แสดง Notification</a>


ตัวอย่าง

แสดง Notification

ดูข้อมูลเพิ่มเติมที่

http://decadecity.net/blog/2012/10/12/webkit-notification-api

http://www.darianshimy.com/blog/2012/08/14/web-notifications-in-chrome-and-safari/


ลองประยุกต์ ให้ขึ้นแสดง การขออนุญาต การใช้งาน notification ด้วย ได้ก็ดี


ninenik 124.120.27.xxx 22-07-2014






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ