,这次要带大家用EXT做一个锁屏的特效，也就是当点击某个按钮的时候,浏览器的屏幕会被一层半透明的色块锁住。当然，这个效果用普通JS也能做。这里仅仅是让大家了解EXT框架的使用方法：
本例中仅使用到了ext-all.js文件。
1. 在此文件夹中建立一个demo文件夹，在demo文件夹中分别建立三个文件：demo.js , demo.html , demo.css
2. demo.html的代码如下，html页面的代码相对简单，容易理解：
<!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>
<title>demo</title>
<link rel="stylesheet" type="text/css" href="demo.css">
<script type="text/javascript" src="../ext-all.js"></script>
<script type="text/javascript" src="demo.js"></script>
</head>
<body>
//按钮，给它取一个ID
<input type="button" id="myButton" value="My Button" />
//用于锁屏的层，具体的样式定义在demo.css中
//在没有点击按钮时，设置它的display属性为none,即不显示该层
<div id="screen" class="screen" style="display:none;"></div>
</body>
</html>
3. demo.css
.screen{
top:0;
left:0;
position:absolute;
background-color: #5e4c0f;
FILTER:alpha(opacity=60); /*CSS滤境，让背景色产生半透明的效果*/
}
4. demo.js代码，内含详细的解释,每个方法的具体说明请查看帮助文档
//直接使用Ext类，注意不是Ext包，具体结构请查看文档
//使用Ext类的onReady()方法，此方法用于初始化，为其它JS代码作准备
Ext.onReady(function() {
//调用Ext的get方法用于得到页面中的一个element，将会返回Element类型的对象
//与document.getElementById("")的功能相同
var myButton = Ext.get("myButton");
var screens = Ext.get("screen");
//调用Element对象(此处是myButton)的on方法，用处是单击按钮后显示锁屏层
//关于Element对象的其它更多方法见Ext包中的Element类
myButton.on("click",function(){
// Ext.getBody()得到当前浏览器对象
//getHeight(),getWidth()方法得到宽和高
var screen_height = Ext.getBody().getHeight();
var screen_width = Ext.getBody().getWidth();
//给screens设置样式属性，并让它显示出来
screens.setStyle("height",screen_height);
screens.setStyle("width",screen_width);
screens.setStyle("display","block");
});
//初始化关闭按钮，
screens.insertHtml("beforeEnd",
"<input type='button' style='height:30px;width:80px;font-size:18px;' id='closeScreenButton' value='关 闭'>",false);
//单击关闭按钮,关闭锁屏
var closeScreenButton = Ext.get("closeScreenButton");
closeScreenButton.on("click",function(){
var screens = Ext.get("screen");
screens.setStyle("display","none");
});
});
OK,锁屏和解屏的都有了，原理很简单，这只是Ext的一点点小功能，还有更强的功能，大家有兴趣可以慢慢研究，小弟在此抛砖引玉，希望大家有更好的文章分享。