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值。

  1. <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
    2. 

  2. <%
    3. 

  3. String path = request.getContextPath();
    4. 

  4. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    5. 

  5. %>
    6. 

    7. 

  7. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    8. 

  8. <html>
    9. 

  9.   <head>
    10. 

  10.     <base href="<%=basePath%>">
    11. 

  11.     <title>My JSP 'index.jsp' starting page</title>
    12. 

  12.         <link rel="stylesheet" type="text/css" href="<%=basePath%>images/core.css"/>
    13. 

  13.      <link rel="stylesheet" type="text/css" href="<%=basePath%>images/rest.css"/>
    14. 

  14. 	<!--
    15. 

  15. 	<link rel="stylesheet" type="text/css" href="styles.css">
    16. 

  16. 	-->
    17. 

  17. 	<script type="text/javascript" src="<%=basePath%>js/jquery-1.8.2.min.js"></script>
    18. 

  18. 	<script type="text/javascript" src="<%=basePath%>js/XY_Base.js"></script>
    19. 

  19. 	<script type="text/javascript">
    20. 

  20. 		Util.loadJS("XY_Dialog.js", function() {
    21. 

  21. 			$("#btn").click(function() {
    22. 

  22. 				Util.Dialog({
    23. 

  23. 					boxID: "XYdialog",
    24. 

  24. 					title: "对话框",
    25. 

  25. 					width: 250,
    26. 

  26. 					height: 100,
    27. 

  27. 					fixed: true,
    28. 

  28. 					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'>隐藏层",
    29. 

  29. 					yesBtn: ["是", function(){
    30. 

  30. 						var item = $(":radio:checked");
    31. 

  31. 						var len=item.length;
    32. 

  32. 						if(len>0){
    33. 

  33. 						  alert("yes--选中的值为："+$(":radio:checked").attr("id"));
    34. 

  34. 						} 
    35. 

  35. 						return true;
    36. 

  36. 					}],
    37. 

  37. 					noBtn: ["不是",function(){
    38. 

  38. 						return true;
    39. 

  39. 					}],
    40. 

  40. 					minBtn: true,
    41. 

  41. 					maxBtn: true
    42. 

  42. 				});
    43. 

  43. 				return false;
    44. 

  44. 			});
    45. 

  45. 		});
    46. 

  46. 	</script>
    47. 

  47.   </head>
    48. 

  48.   <body>
    49. 

  49.     <div>
    50. 

  50.     <br/>
    51. 

  51.     <br/>
    52. 

  52.     <br/>
    53. 

  53.     <input type="text" name="ddd">
    54. 

  54.     	<button id="btn">点击</button>
    55. 

  55.     </div>
    56. 

  56.     <div id="tag">
    57. 

  57. 	</div>
    58. 

  58. 	<input type='radio' name='rad' id='inputTrans'>输入层<br>
    59. 

  59. 	<input type='radio' name='rad' id='outputTrans'>输出层<br>
    60. 

  60. 	<input type='radio' name='rad' id='obserTrans'>隐藏层
    61. 

  61.   </body>
    62. 

  62. </html>

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

好用的消息对话框-TipsWindown的更多相关文章

  1. Qt——消息对话框的设计

    1.消息对话框是什么 消息对话框(MessageBox)提供了一个模态对话框,用来通知用户某些信息,或者用来询问用户一个问题并获得一个答复. 先看下面2张图—— 第一张图是网易云音乐的界面截图,在删除 ...

  2. JavaScript入门篇 第二天（消息对话框+网页弹出）

    提问(prompt 消息对话框) prompt弹出消息对话框,通常用于询问一些需要与用户交互的信息.弹出消息对话框(包含一个确定按钮.取消按钮与一个文本输入框). 语法: prompt(str1, s ...

  3. MFC编程入门之十六（对话框:消息对话框）

    前面几节讲了属性页对话框,我们可以根据所讲内容方便的建立自己的属性页对话框.本节讲解Windows系统中最常用最简单的一类对话框--消息对话框. 我们在使用Windows系统的过程中经常会见到消息对话 ...

  4. [转载]ExtJs4 笔记（6） Ext.MessageBox 消息对话框

    作者:李盼(Lipan) 出处:[Lipan] (http://www.cnblogs.com/lipan/)版权声明:本文的版权归作者与博客园共有.转载时须注明本文的详细链接,否则作者将保留追究其法 ...

  5. 弹出消息对话框ScriptManager

    //直接调用WebMessageBox方法 #region 弹出消息对话框 /// <summary> /// 弹出消息对话框 /// </summary> /// <p ...

  6. 【转】Delphi的消息对话框

    Delphi的消息对话框 输入输出inputBox()函数MessageBox()ShowMessage 对话框是Windows操作系统中程序与用户沟通的一种常见的交互方式,对话框可以向用户提供当前程 ...

  7. 确认(confirm 消息对话框)

    confirm 消息对话框通常用于允许用户做选择的动作(包括一个确定按钮和一个取消按钮). 语法: confirm(str) str:在消息对话框中要显示的文本 返回值: 当用户点击"确定& ...

  8. 工作总结：VS2010/MFC编程入门之十六（对话框：消息对话框）

    原文地址:http://www.jizhuomi.com/software/171.html 我们在使用Windows系统的过程中经常会见到消息对话框,提示我们有异常发生或提出询问等.因为在软件开发中 ...

  9. VS2010/MFC对话框：消息对话框

    消息对话框 我们在使用Windows系统的过程中经常会见到消息对话框,提示我们有异常发生或提出询问等.因为在软件开发中经常用到消息对话框,所以MFC提供了两个函数可以直接生成指定风格的消息对话框,而不 ...

随机推荐

  1. Inno Setup入门（七）——提供安装语言选项

    Inno Setup安装目录下有一个Languages的文件夹,该文件夹提供了可供使用的语言,通过在脚本中加入[languages]段,可以实现该项功能,实现代码如下: [setup] ;全局设置,本 ...

  2. SQL 合并列值和拆分列值

    合并列值 表结构,数据如下: id value ----- ------ aa bb aaa bbb ccc 需要得到结果: id values ------ ----------- aa,bb aa ...

  3. MySql 插入10位以上长度的字符报错or截断

    当a字段为int类型时: 如果用MyBatis向MySql插入10个字符以上长度的字符串,则会报错. 如果直接在MySql中用sql语句插入10个字符以上长度的字符串,则会变成最大的int类型数值:2 ...

  4. github 　安装配置以及使用遇到的一些问题

    Git是一个分布式的版本控制系统,最初由Linus Torvalds编写,用作Linux内核代码的管理.在推出后,Git在其它项目中也取得了很大成功,尤其是在Ruby社区中.目前,包括Rubinius ...

  5. Webdriver中实现区域截图的方式以及如何截取frame中的图片

    import java.awt.Rectangle;import java.awt.image.BufferedImage;import java.io.File;import java.io.IOE ...

  6. 介绍两个Android不常用的Drawable：GradientDrawable和 StateListDrawable

    //-------------------------------------------------------------------------------------------------- ...

  7. java 网络编程Socket编程

    Server.java import java.io.*; import java.net.*; public class Server { public static void main(Strin ...

  8. Linux学习 -- 用户和用户组管理

    1 用户配置文件 1.1 用户信息文件 /etc/passwd 查看帮助 man 5 passwd -- account:password:UID:GID:GECOS:directory:shell ...

  9. rabbitmq用于分布式系统

    上文介绍了RabbitMQ在linux下的安装,这里就简单的介绍一下基于RabbitMQ的开发.RabbitMQ已经提供了一大坨材料. Java – http://www.RabbitMQ.com/j ...

  10. Android自定义属性，format详解

    1. reference:参考某一资源ID. (1)属性定义: <declare-styleable name = "名称"> <attr name = &quo ...