首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

JQuery Blockui遮罩效能

2012-11-06 
JQuery Blockui遮罩功能.jsp页面内实现(写在head与/head之间)script typetext/javascriptsrcs:

JQuery Blockui遮罩功能

.jsp页面内实现(写在<head>与</head>之间)

<script type="text/javascript"src="<s:url value="/js/jquery-1.3.2.js"/>"></script>

<script type="text/javascript"src="<s:url value="/js/jquery.js"/>"></script>

<script type="text/javascript">

???$(document).ready(function(){?

??????? $(‘#test’).click(function() { <!--test,question,no为控件的id-->

???????????$.blockUI({ message: $(‘#question’),

<!--遮罩页面,显示id为question的控件-->

??????????? css:{

???????????????top:? ($(window).height() - 500)/2 + 'px',

???????????????left: ($(window).width() - 700) /2 + 'px',

???????????????width: '700px'?

???????????????} <!--css样式-->

???????????});????????????

??????? });?

??????? $(‘#no’).click(function() {

???????????$.unblockUI(); <!--当click?id为no的控件,解除页面遮罩-->

??????????? return false;

??????? });

});

</script>

注:id为question和no的控件可以是隐藏的

Example:<div id="question" style="cursor:default; display: none;"> …</div>

?

热点排行