好用的消息对话框-TipsWindown

最新推荐文章于 2024-05-17 13:52:13 发布

weixin_34387468

最新推荐文章于 2024-05-17 13:52:13 发布

阅读量118

点赞数

文章标签： javascript java ViewUI

TipsWindow的官网地址为： http://leotheme.cn/javascript/jquery-plugins-tipswindow-2-0.html

这个是一个爱好者维护的！在这里感谢这位爱好者！

1、 JQ弹出层插件(tipsWindow 3.2)

说明：

一个基于jQuery的弹出层。

支持拖拽，支持多窗口。内容为文字，ID，图片，SWF，URL，框架；

2、使用教程

一个基于jQuery的弹出层插件。支持多窗口，拖动，最大化最小化，固定定位，相对于某个位置定位，具有简化的Tips模式。可以自定义外观等等，具体的看参数和演示（兼容ie内核、webkit内核、ff、opera等主流浏览器）

导入js文件和css文件

注意的地方：

jquery的版本必须和这个相对应，尽量不要使用其他版本的！

这里我就介绍一个我用的一个功能，提示框中有单选框，当选中一个单选框时，使用alert提示选中的单选框的id值。

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<link rel="stylesheet" type="text/css" href="<%=basePath%>images/core.css"/>
<link rel="stylesheet" type="text/css" href="<%=basePath%>images/rest.css"/>
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="<%=basePath%>js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/XY_Base.js"></script>
<script type="text/javascript">
Util.loadJS("XY_Dialog.js", function() {
$("#btn").click(function() {
Util.Dialog({
boxID: "XYdialog",
title: "对话框",
width: 250,
height: 100,
fixed: true,
content: "text:<input type='radio' name='rad' id='inputTrans'>输入层<br><input type='radio' name='rad' id='outputTrans'>输出层<br><input type='radio' name='rad' id='obserTrans'>隐藏层",
yesBtn: ["是", function(){
var item = $(":radio:checked");
var len=item.length;
if(len>0){
alert("yes--选中的值为："+$(":radio:checked").attr("id"));
}
return true;
}],
noBtn: ["不是",function(){
return true;
}],
minBtn: true,
maxBtn: true
});
return false;
});
});
</script>
</head>
<body>
<div>
<br/>
<br/>
<br/>
<input type="text" name="ddd">
<button id="btn">点击</button>
</div>
<div id="tag">
</div>
<input type='radio' name='rad' id='inputTrans'>输入层<br>
<input type='radio' name='rad' id='outputTrans'>输出层<br>
<input type='radio' name='rad' id='obserTrans'>隐藏层
</body>
</html>

完整教程见http://leotheme.cn/wp-content/uploads/dev/module/Dialog/

来自为知笔记(Wiz)

weixin_34387468

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
好用的消息对话框-TipsWindown

TipsWindow的官网地址为：http://leotheme.cn/javascript/jquery-plugins-tipswindow-2-0.html 这个是一个爱好者维护的！在这里感谢这位爱好者！1、JQ弹出层插件(tipsWindow 3.2)说明：一个基于jQuery的弹出层。支持拖拽，支持多窗口。内容为文字，ID，图片，SWF，URL，框架；2、使用教程一个基于jQuer...
复制链接

扫一扫