XYTipsWindow 2.8

XYTipsWindow 2.8

关于插件：

http://leotheme.cn/wp-content/uploads/Example/js/tipswindow/index.html#

一个基于jQuery的弹出层。最新版本2.7;
支持拖拽，支持多窗口。内容为文字，ID，图片，SWF，URL，框架；
这个插件前前后后修改了几个月了。一直在改进；到现在差不多了。以后不会经常更新了；

更新：(2011-05-16)

更新了一下，IE6之前的报错已经修复。然后增强了随机ID的生成时的防重复； 然后新增了一个获取当前弹出层ID的方法[$.XYTipsWindow.getID()]。；

应用演示：

• 兼容性测试元素： 
  
  下拉框：  http://leotheme.cn/http://www.wopus.org/
  
  输入框： 
  
  链接： 默认 
  
• 弹出普通文本信息提示以及位置演示： 
  

  $("#ID").click(function(){
  	$.XYTipsWindow();//默认
  	$.XYTipsWindow({___offsets:"left-top"});//左上角
  	$.XYTipsWindow({___offsets:"right-top"});//右上角
  	$.XYTipsWindow({___offsets:"left-bottom"});//左下角
  	$.XYTipsWindow({___offsets:"right-bottom"});//右下角
  	$.XYTipsWindow({___offsets:"left-middle"});//靠左居中
  	$.XYTipsWindow({___offsets:"right-middle"});//靠右居中
  	$.XYTipsWindow({___offsets:"middle-top"});//居中置顶
  	$.XYTipsWindow({___offsets:"middle-bottom"});//居中置底
  	$.XYTipsWindow({___offsets:{left:"100px",top:"100px"}});//自定义
  });

  不带参数  左上角  右上角  左下角  右下角  靠左居中 靠右居中  居中置顶  居中置底  自定位置
• 其他特殊应用演示： 
  

  $("#ID").click(function(){
  	$.XYTipsWindow();//默认
  	//这部分大家直接查看源文件吧
  });

  无边框  透明边框  alert  confirm  载入提示  普通TIPS 吸附模式  右下弹出  可拖动  自动关闭
• 弹出一个普通的信息提示（可拖动，遮罩层）： 
  

  $("#test2").click(function(){
  	$(this).XYTipsWindow({
  		___title:"Hello world",
  		___content:"text:提示信息内容",
  		___width:"300",
  		___height:"200",
  		___dray:"___boxTitle",
  		___showbg:true
  	});
  });

  点击测试
• 弹出页面中的某个ID（可拖动，遮罩层）： 
  

  $.XYTipsWindow({
  	___title:"弹出页面中的某个ID",
  	___content:"id:testID",
  	___showbg:true,
  	___drag:"___boxTitle"
  });

  点击测试
• 弹出一张图片（可拖动，遮罩层）： 
  

  $("#test4").click(function(){
  	$(this).XYTipsWindow({
  		___title:"Hello world",
  		___content:"img:图片路径",
  		___width:"500",
  		___height:"250",
  		___drag:"___boxTitle",
  		___showbg:true
  	});
  });

  点击测试
• 弹出一个视频或FLASH动画（可拖动）： 
  

  $("#test4").click(function(){
  	$(this).XYTipsWindow({
  		___title:"Hello world",
  		___content:"swf:路径",
  		___width:"225",
  		___height:"185",
  		___drag:"___boxTitle"
  	});
  });

  点击测试
• 加载一个文件（也可以是.php/.asp?id=4之类的,可拖动，遮罩层）： 
  

  $("#test5").click(function(){
  	$(this).XYTipsWindow({
  		___title:"Hello world",
  		___content:"url:get?test.html",
  		___width:"400",
  		___height:"200",
  		___drag:"___boxTitle",
  		___showbg:true
  	});
  });

  点击测试
• 加载一个网页到框架里（可拖动，遮罩层）： 
  

  $("#test6").click(function(){
  	$(this).XYTipsWindow({
  		___title:"框架应用",
  		___content:"iframe:http://leotheme.cn",
  		___width:"900",
  		___height:"500",
  		___drag:"___boxTitle",
  		___showbg:true
  	});
  });

  点击测试

相关下载：

JS文件下载 | 完整包下载