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. AJAX 在手机上用时

    Response.ContentType = "text/html; text/plain; charset=UTF-8";

  2. .net网站报错：对象的当前状态使该操作无效

    微软在2011年12月29号发布的2011年最后一个更新让哥哥为程序出现的异常头痛了一天． 这个异常在页面数据量小的时候并不会触发,只在页面数据量大的情况下才会出现,开始解决起来让人无从下手,最后才发 ...

  3. Windows 常用消息及含义

      消息范围 说明 0 - WM_USER – 1 系统消息 WM_USER - 0x7FFF 自定义窗口类整数消息 WM_APP - 0xBFFF 应用程序自定义消息 0xC000 - 0xFFFF ...

  4. Video Cards

    Video Cards time limit per test 1 second memory limit per test 256 megabytes input standard input ou ...

  5. php 版本比较

    判断当前运行的 PHP 版本是否高于或等于你提供的版本号. function is_php($version) { static $_is_php; $version = (string) $vers ...

  6. Android:TextView最小行数设置

    我们有时候为了保证TextView必须有一个最小的高度,那么就需要设置这个行数. 因为如果你不设置的话,在measure这个TextView的时候,此时就无法准确的得到一个最小高度.因为设备不同,所以 ...

  7. selenium RC

    http://blog.sina.com.cn/s/blog_68cb48770100v9c7.html http://www.cnblogs.com/hyddd/archive/2009/05/24 ...

  8. js框架——angular.js（2）

    1. 模块的利用扩充 模块的名称也可以当做变量使用,例如: <body ng-app> <label><input type="checkbox" n ...

  9. java.lang.ClassNotFoundException: org.apache.lucene.store.Directory

    看下你的lucene-core.jar有没有在WEB-INF\lib下.

  10. 学习笔记——策略模式Strategy

    策略模式,与模板模式一样,都是为了将接口和算法实现解耦,但策略模式更主要是整体算法的替换,而模板模式主要是流程一致,部分算法的替换. 个人理解为,一般算法替换,使用策略模式,当算法流程一致,可以提取为 ...