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. 用Chrome开发者工具做JavaScript性能分析

    来源: http://blog.jobbole.com/31178/ 你的网站正常运转.现在我们来让它运转的更快.网站的性能由页面载入速度和代码执行效率决定.一些服务可以让你的网站载入更快,比如压缩J ...

  2. 笨方法学python--变量和命名

    1 =(单等号)和==(双等号)的区别 =用来赋值, ==用来判断是否相等 2 x = 100 在操作符2侧加空格,易读 3 打印时,进行字符串拼接 print "there are&quo ...

  3. Openlayers 3 的 imagelayer

    <body> <div id="map"></div> <script> var extent = [0, 0, 1024, 968 ...

  4. ReactiveCocoa 用法实例

      我个人非常推崇ReactiveCocoa,它就像中国的太极,太极生两仪,两仪生四象,四象生八卦,八卦生万物.ReactiveCocoa是一个高度抽象的编程框架,它真的很抽象,初看你不知道它是要干嘛 ...

  5. hdu 1001 二叉树搜索

    Problem Description 判断两序列是否为同一二叉搜索树序列 Input 开始一个数n,(1<=n<=20) 表示有n个需要判断,n= 0 的时候输入结束.接下去一行是一个序 ...

  6. git使用之如何将github库下载到本地与如何将代码上传github

    git使用之如何将github库下载到本地与如何将代码上传github ---------------------------------------------------------------- ...

  7. [转]PHP经验——PHPDoc PHP注释的标准文档

    文档翻译自:http://en.wikipedia.org/wiki/Phpdoc 标记 用途 描述 @abstract   抽象类的变量和方法 @access public, private or ...

  8. listview的条目（item）如何做出卡片效果

    卡片,其实就是一张背景图片,但做也还需要注意一点. 错误做法: <?xml version="1.0" encoding="utf-8"?> < ...

  9. netty最快？

    http://www.techempower.com/blog/2013/04/05/frameworks-round-2/

  10. mysql链接表，connection string, federated engine

    http://database.51cto.com/art/201011/234561.htm