Sender's name : 断桥残雪
Sender's Email : ksky521@gmail.com
Referrer : http://www.cssrain.cn/demo/1/mail.html
wBox——轻量级的弹出窗口jQuery插件,基于jQuery1.4开发,主要实现弹出框的效果,并且加入了很多有趣的功能,比如可img灯箱效果,callback函数,显示隐藏层,Ajax页面,iframe嵌入页面……
- 背景透明度可以根据实际情况进行调节,甚至不设置背景
- 可以根据需要添加wBox标题
- 支持设置窗口位置,默认为在中心显示
- 支持callback函数
- 支持html内容自定义
- img灯箱看图功能
- 支持在wBox显示#ID的内容
- 支持Ajax页面内容
- 支持设置背景,不设置背景
- 支持wBox拖拽功能
- ESC键,或者在背景上双击即可关闭wBox
- .wBoxClose的内容click可以关闭wBox,无论是组装的html,还是隐藏的html,甚至于iframe的内容中的.wBoxClose
下面简单介绍下wBox的使用方法:
简单的使用方法
- 首先下载wBox文件,然后将wBox中的
- 引入wbox.js文件
- 引入wbox.css文件
-
注意:wBox源代码文件夹中的图片要跟js,css放在相同的目录下,loading.gif要跟你页面放在同一个目录
html代码如下:
<a href="#nosee" class='wBox'>这是一个隐藏wBox</a>
<div id="nosee" style="display:none">这里是个隐藏的id为nosee的DIV</div>
<a href='http://www.js8.in/wbox/001.jpg' class='wBox'>这是一个image wBox</a>
js代码如下:
$(".wBox").wBox();
这样就建立了一个最简单的wBox.
置名字的wBox
$("#wbox1").wBox({
title: "Test Title Name",
html: "点击弹出设置名字的wBox"
});
景为透明的wBox
$("#wbox2").wBox({opacity:0,html:'点击弹出背景为透明的wBox'});
出无背景wBox
$("#wbox3").wBox({overlay:false,html:'点击弹出无背景wBox'});
ref为图片的进行wBox
$('.wbox').wBox();
藏id为#info的层
代码:
$('.wbox').wBox();
拖拽的#wBoxUL层
$('#drag').wBox({drag:true,title:'wBox功能简介部分的层'});
mg灯箱连看
$("#imgA").wBox({images:['001.jpg','002.jpg','003.jpg','004.jpg','005.jpg'],isImage:true});
frame页面嵌入百度
$("#isFrame").wBox({isFrame:true,iframeWH:{width:800,height:400}});
地iframe 自使用高度
$("#isFrame2").wBox({isFrame:true});
置位置为left300 top 100
$('#setPos').wBox({setPos:true,left:300,top:100,html:'设置位置为left300 top 100'});
jax加载内容
$("#ajax").wBox();
有标题的弹出框
$("#noTitle").wBox({noTitle:true});
用callback添加地图的wBox
var maplet=null;
oo=false;
var callback=function(){
maplet = new Maplet('myMap');
maplet.centerAndZoom(new MPoint('HEUIDVZVVHUEEU'),8);
maplet.addControl(new MStandardControl({view: {pan:false,ruler: false}}));
}
$("#map").wBox({
title:'<span style="font-size:14px">普加地图</span>--<span style="font-size:12px">可拖拽</span>',
html:"<div id='myMap' style='width:500px;height:400px;'></div>",
callBack:callback,drag:true});
加载地图-利用callback函数
查看演示
博文来源:http://www.cssrain.cn/default.asp?id=1435
分享到:
相关推荐
jquery的弹出层插件,domwindow.js,非常轻量好用
wBox——轻量级的弹出窗口jQuery插件,基于jQuery1.4.2开发,主要实现弹出框的效果,并且加入了很多有趣的功能,比如可img灯箱效果,callback函数,显示隐藏层,Ajax页面,iframe嵌入页面…… 背景透明度可以根据...
jquery弹窗 开源 免费 轻量级 适合网站制作中的内容提示,图片上传等。
wBox 1.0 jQuery 弹出框插件正式版.zip
JQuery是前端web设计页面的的必备的技术之一,也是让网页的效果达到全新的技术之一,wbox是对弹出框的一种遮罩层!
jquery轻量级上下(左右)滚动条插件及使用方法
基于jquery的wbox弹出框,添加了多个效果
NULL 博文链接:https://dodomail.iteye.com/blog/1671401
wbox.js为一个Jquery弹窗插件,是一款值得推荐的弹窗插件
内容索引:脚本资源,Ajax/JavaScript,弹出框,自动关闭 wBox ,基于jQuery1.4.2的一个弹出框插件,与其它不同的是,它可以自动关闭,并且加入了很多有趣的功能,比如callback函数,显示隐藏层,Ajax页面,iframe嵌入...
轻量级的弹出窗口jQuery插件,压缩后仅仅3.65Kb,基于jQuery1.4.2开发,主要实现弹出框的效果,并且加入了很多有趣的功能,比如callback函数,显示隐藏层,Ajax页面,iframe嵌入页面……
——轻量级的弹出窗口jQuery插件,压缩后仅仅3.65Kb,基于jQuery1.4.2开发,主要实现弹出框的效果,并且加入了很多有趣的功能,比如callback函数,显示隐藏层,Ajax页面,iframe嵌入页面……
$('.wBox_b').remove(); if (wBox != null) { wBox.close(); } wBox = $("#wbox1").wBox({ title: "", html: msg, noTitle: true }); wBox.showBox(); 脚本中这样使用
linux版本wbox模拟web服务器工具
有关Jquery的一些插件如:JQuery的JSTree插件,wBox插件,以及学习资料如,锋利的JQuery等。
map(1).wbox
软件介绍: 信捷PLC编程软件XC系列编程工具V3.3R支持WIN7以上系统,内附XINJEConfig配置工具安装包。本程序需要系统内安装有.net frameworks 2.0 (包括以上版本)。注意问题:若编程软件不...调整WBOX参数配置界面