共两个文件，index.html和setting.html
下面是index.html的代码：
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html lang="en"> 3 4 <head> 5 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 6 <title>fonty - amazing font tool for designers.</title> 7 <link rel="stylesheet" href="css/main.css"> 8 </head> 9 <script> 10 //实时预览 11 var gulp = require(‘gulp‘); 12 gulp.task(‘reload‘, function () { 13 if (location) location.reload(); 14 }); 15 16 gulp.watch(‘**/*‘, [‘reload‘]); 17 18 var gui = require(‘nw.gui‘); 19 mainWindow = gui.Window.get(); 20 21 var newwin = function (){ 22 window.open(‘setting.html‘); 23 } 24 mainWindow.on(‘close‘, function() { 25 gui.App.closeAllWindows(); 26 this.close(true); 27 }); 28 </script> 29 30 <body> 31 <div id="maincontent"> 32 <div id="leftbar"> 33 <div class="logo"><img src="images/logo.png" alt=""></div> 34 </div> 35 <div id="rightbar"><a href="#" onclick="newwin()">new window</a></div> 36 </div> 37 </body> 38 39 </html>
然后是setting.html的代码：
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html lang="en"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 5 <title>setting</title> 6 </head> 7 <script> 8 var gui = require(‘nw.gui‘); 9 var currentWindow = gui.Window.get(); 10 currentWindow.on(‘enter-fullscreen‘, function () { 11 console.log(‘Windows has entered fullscreen mode‘); 12 }); 13 currentWindow.on(‘leave-fullscreen‘, function () { 14 console.log(‘Windows has left fullscreen mode‘); 15 }); 16 </script> 17 <body> 18 <a href="#" onclick="currentWindow.toggleFullscreen()">Toggle 19 Fullscreen</a><br> 20 <a href="#" onclick="currentWindow.close()">Close</a> 21 </body> 22 </html>
这里应该不用注释了，因为太简单了。
不过要说明的是，index.html里有关gulp的部分，是为了在sublime text中实现实时预览添加的代码，方便调试用。
原文：http://www.cnblogs.com/xiaoyaoseng/p/6379302.html