5/18/12

HTML5 Desktop Notification Tutorial

Desktop notification là một tính năng thú vị của HTML5. Websites của bạn có thể gửi notification ra ngoài màn hình desktop. Tuy nhiên, hiện tại nó chỉ hổ trợ trình duyệt google chrome. Mời các bạn xem demo
DEMO



Code:

<html>
<title>Demo desktop notification javascript</title>
<head>
<script>

    if (!window.webkitNotifications) {
        alert('Sorry , your browser does not support desktop notification. Try Google Chrome.');
    }
        function RequestPermission (callback)
    {
        window.webkitNotifications.requestPermission(callback);
    }
    function notification ()
    {      
        if (window.webkitNotifications.checkPermission() > 0) {
            RequestPermission(notification);
        }

       
        var icon  = 'http://thienduongweb.com/logo.png';
        var title = 'BEAKKON';
        var body   = 'Flying he keeps his eyes on the stars';

     
        var popup = window.webkitNotifications.createNotification(icon, title, body);
        popup.show();
        setTimeout(function(){
        popup.cancel();
        }, '15000');
    }
   
    function HTMLnotification ()
    {
        if (window.webkitNotifications.checkPermission() > 0) {
            RequestPermission(HTMLnotification);
        }

       
        var popup = window.webkitNotifications.createHTMLNotification('http://www.thienduongweb.com');
        popup.show();
        setTimeout(function(){
        popup.cancel();
        }, '15000');
    }
</script>
</head>
<body>
<button onclick="notification()">NOTIFY</button>
<button onclick="HTMLnotification()">NOTIFY ME(HTML)</button>
</body>
</html>
Bookmark and Share

0 comments:

Post a Comment

Next previous home

Cộng đồng yêu thiết kế Việt Nam Thiet ke website, danang