如何设置jquery layer弹窗弹层位置
发布网友
发布时间：2022-04-23 06:11
共2个回答
热心网友
时间：2022-04-07 09:45
关键语法如下：
layer.open({
type: 1,
content: $('#id') //这里content是一个DOM，这个元素要放在body根节点下
});
实例：
<!DOCTYPE HTML><html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="jquery-1.9.1.min.js"></script>
<script src="layer/layer.js"></script>
<script>
$(function () {
$("a").click(function () {
layer.open({
type: 1,
closeBtn: false,
shift: 2,
shadeClose: true,
content: $("#box1")
});
})
})
</script>
<style>
*{padding:0; margin: 0;}
#box1{width:555px; height:600px; background: #eee; display:none;}
</style>
</head>
<body>
<a href="#">点击</a>
<div id="box1">
111
</div>
</body>
</html>
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。
jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。
在jQuery迅速发展的同时，一些大的厂商也看中了商机。2009年9月，微软和诺基亚公司正式宣布支持开源的jQuery库，另外，微软公司还宣称他们将把jQuery作为Visual Studio工具集的一部分。他将提供包括jQuery的智能提示、代码片段、示例文档编制等内容在内的功能。微软和诺基亚公司将长期成为jQuery的用户成员，其他成员还有Google，Intel，IBM，Intuit等公司。
2009年1月，jQuery 1.3版发布，它使用了全新的选择符引擎Sizzle，在各个浏览器下全面超越其他同类型JavaScript框架的查询速度，程序库的性能也因此有了极大提升。这一版本的第2个变化就是提供live()方法，使用live()方法可以为当前及将来增加的元素绑定事件，在1.3版之前，如果要为将来增加的元素绑定事件，需要使用livequery插件，而在1.3版中，可以直接用live()方法。
2010年1月，也是jQuery的四周年生日，jQuery 1.4版发布，为了庆祝jQuery四周岁生日，jQuery团队特别创建了jquery14.com站点，带来了连续14天的新版本专题介绍。
在1.3及更早版本中，jQuery通过JavaScript的eval方法来解析json对象。在1.4中，如果你用的浏览器支持，则会使用原生的JSON.parse解析json对象，这样对json对象的书写验证则更为严格。比如：{foo: "bar"}的写法将不会被验证为合法的json对象，必须写成{"foo":"bar"}。如果你的程序打算升级到1.4版本，那么这一点要尤其注意。
热心网友
时间：2022-04-07 11:03
type: 1,
title: false,
area: ['auto', 'auto'],
border: [0], //去掉默认边框
shade: [0], //去掉遮罩
closeBtn: [0, false], //去掉默认关闭按钮
shift: 'left', //从左动画弹出
page: {
html: '<div style="width:420px; height:260px; padding:20px; border:1px solid #ccc; background-color:#eee;"><p>我从左边来，我自定了风格。</p><button id="pagebtn" class="btns" onclick="">关闭</button></div>'
}
});
