`
xpp02
  • 浏览: 1048865 次
社区版块
存档分类
最新评论

jquery右下角弹窗效果

阅读更多

 

复制代码保存到txt文本,改后缀为.html。注意引进两个js文件。jquery.js可以到官网下,jquery.messager.js我上篇博文发了,可以下载。

 

[html] view plaincopy
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <script type="text/javascript" src="jquery-1.7.1.js"></script>  
  6. <script type="text/javascript" src="jquery.messager.js"></script>  
  7. <title>jquery右下角弹窗效果</title>  
  8. <script language="javascript">  
  9. $(function () {  
  10.     $.messager.show(0,'一个Jquery Messager消息弹出插件!');   
  11.     $("#showMessager300x200").click(function(){   
  12.         $.messager.lays(300, 200);   
  13.         $.messager.show(0, '300x200的消息',40000);   
  14.     });   
  15.     $("#showMessagerFadeIn").click(function(){   
  16.         $.messager.anim('fade', 2000);   
  17.         $.messager.show(0, 'fadeIn动画消息');   
  18.     });   
  19.     $("#showMessagerShow").click(function(){   
  20.         $.messager.anim('show', 1000);   
  21.         $.messager.show(0, 'show动画消息');   
  22.     });   
  23.     $("#showMessagerDim").click(function(){   
  24.         $.messager.show('<font color=red>自定义标题</font>', '<font color=green style="font-size:14px;font-weight:bold;">自定义内容</font>');   
  25.     });   
  26.     $("#showMessagerSec").click(function(){   
  27.         $.messager.show(0, '一秒钟关闭消息', 1000);   
  28.     });   
  29. });  
  30.   
  31. </script>  
  32. </head>  
  33.   
  34. <body>  
  35. <p><strong>JQUEYR PLUGIN - Messager </strong></p>   
  36.   
  37. <p><input type="button" id="showMessager300x200" value="显示一个300x200的消息" /></p>   
  38. <p><input type="button" id="showMessagerFadeIn" value="显示一个fadeIn动画消息" /></p>   
  39. <p><input type="button" id="showMessagerShow" value="显示一个show动画消息" /></p>   
  40. <p><input type="button" id="showMessagerDim" value="显示定义内容和标题消息" /></p>   
  41. <p><input type="button" id="showMessagerSec" value="一秒钟关闭消息" /></p>   
  42. <br /><br />  
  43.   
  44. <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>  
  45. <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>  
  46. <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>  
  47. <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>  
  48. </body>  
  49. </html>  

 

更多信息请查看 java进阶网 http://www.javady.com/index.php/category/thread

2
0
分享到:
评论
1 楼 jackyrong 2012-09-03  
ie 9 下时,老显示关闭窗口提示,有办法去掉么,就是关闭掉那个弹出窗口的提示

相关推荐

    Jquery右下角弹窗

    在网页开发中,jQuery是一种广泛...通过以上步骤,你就能在网页中创建出一个功能齐全、视觉效果良好的jQuery右下角弹窗。这个功能可以用于显示系统消息、通知用户或请求确认信息,极大地提高了网页的互动性和用户体验。

    jQuery右下角弹窗插件

    **jQuery右下角弹窗插件详解** 在网页开发中,弹窗是一种常见的交互元素,用于展示通知、警告、确认信息或提供用户交互界面。jQuery作为一款轻量级的JavaScript库,提供了丰富的API来简化DOM操作,使得创建弹窗插件...

    JS右下角弹窗两例JS右下角弹窗两例

    本文将详细介绍两种实现JS右下角弹窗的方法,一种基于jQuery库,另一种则是使用原生JavaScript。 首先,jQuery右下角弹窗是一种利用jQuery库高效简便实现弹窗的方式。jQuery是一个广泛使用的JavaScript库,它简化了...

    jQuery javascript js html h5 屏幕 右下角弹窗 自动提醒

    在创建屏幕右下角弹窗时,jQuery的便利性尤为突出,因为它提供了优雅的语法来处理这些任务。 1. **DOM操作**:在HTML5中,可以创建一个隐藏的div元素作为弹窗的基础结构,通过jQuery选择器找到这个元素,并在适当的...

    网页右下角弹窗

    为右下角弹窗定制样式,可以设置其位置(通常使用绝对定位,结合`right`和`bottom`属性使其位于屏幕右下角)、大小、颜色、边框、阴影等效果。CSS3引入了许多新特性,如过渡(transition)和动画(animation),使得...

    前端+jquery右下角弹窗显示当前用户登录IP和登陆的城市地址

    在前端开发中,实现一个jQuery右下角弹窗来展示用户登录的IP和城市地址是一项常见的需求,尤其在用户管理或者个性化服务中。这个功能能够帮助网站提供更精确的服务,例如根据用户的位置信息推送相关的内容或者提醒。...

    jQuery右下角pop弹窗漂浮广告代码

    在创建右下角弹窗漂浮广告时,jQuery的这些功能将发挥关键作用。 1. **DOM操作**:jQuery提供了方便的语法来选择、操作和修改HTML元素。例如,我们可以使用`$(selector)`选择器找到页面上的特定元素,然后用`.html...

    右下角弹窗代码 web开发

    在Web开发中,右下角弹窗是一种常见的用户体验设计,用于显示通知、提示信息或确认操作。这种功能的实现通常涉及到JavaScript,一种广泛使用的客户端脚本语言,它允许我们在用户的浏览器上动态地处理和更新页面内容...

    JS高仿QQ右下角弹窗有声音 兼容主流浏览器_2011-11-22[K8].rar

    标题中的“JS高仿QQ右下角弹窗有声音”是指使用JavaScript编程语言来实现一个类似于腾讯QQ的右下角弹窗通知功能,并且这个弹窗还具备声音提示的效果。这种技术在网页应用中十分常见,可以用于向用户推送消息、更新...

    jquery右下角提示框插件

    jquery右下角提示框插件,很好用,有类似需求的同志可以下载下来看一下

    防QQ消息 右下角弹窗

    综上所述,这个压缩包提供的资源是一个基于jQuery的右下角弹窗示例,适用于学习如何在网页中实现类似QQ消息通知的效果,同时避免对用户的正常浏览造成过多干扰。通过分析和理解代码,开发者可以将这种功能应用到自己...

    jQuery-实现右下角自动弹窗提示.zip

    本教程将深入探讨如何使用jQuery实现一个右下角自动弹窗提示的功能,这个功能常见于许多网站,用于通知用户更新、提醒或者提供交互信息。 首先,要实现这个功能,我们需要确保网页中已经引入了jQuery库。这通常通过...

    jQuery右下角自动弹窗提示代码

    本教程将详细讲解如何利用jQuery实现右下角自动弹窗提示的功能,这对于网页的用户体验提升有着重要作用。 首先,我们需要了解jQuery的基本用法。jQuery的核心是一个选择器引擎,它允许开发者通过CSS选择器来选取DOM...

    jQuery右下角pop弹窗漂浮广告代码,兼容主流浏览器.rar

    在本文中,我们将深入探讨如何使用jQuery实现右下角的pop弹窗漂浮广告功能,同时确保该功能在主流浏览器中具有良好的兼容性。jQuery是一个强大的JavaScript库,它简化了DOM操作、事件处理、动画效果以及Ajax交互等...

    jQuery Messager 右下角弹窗插件

    内容索引:脚本资源,jQuery,右下角,弹窗 jquery messager 右下角弹窗插件,方便在网页右下角弹出窗口,可弹出一个标准的弹窗、一个含有标题和自定义内容的弹窗,可显示Flash的弹窗,版本1.5更新:  1、修正设置不...

    .net 网页右下角弹窗

    在.NET框架中,实现网页右下角弹窗功能通常是用于向用户展示临时通知、提示信息或者简单的交互。这种功能在Web开发中很常见,尤其是在构建动态交互式网站时。本篇将详细介绍如何在.NET环境中创建一个右下角弹出窗口...

    使用Jquery 或Message插件实现右下角弹出框

    在实现右下角弹框时,Jquery主要负责动态创建和定位元素,以及处理用户交互。 1. **完全基于Jquery实现的右下角弹框** 要完全基于Jquery实现弹出框,首先需要创建一个HTML结构,通常包含一个隐藏的弹框元素,然后...

    js特效脚本含源码和说明jQuery右下角pop弹窗漂浮广告代码

    js特效脚本含源码和说明jQuery右下角pop弹窗漂浮广告代码本资源系百度网盘分享地址

    JS实现IE浏览器最小化在桌面右下角弹窗显示

    在本文中,我们将深入探讨如何利用JS实现在Internet Explorer(IE)浏览器最小化时,在桌面右下角弹窗显示信息的技术。 首先,我们需要理解浏览器的工作原理。当用户将IE浏览器最小化时,窗口并不会完全消失,而是...

    Jquery右下角弹出框提示,多个提示向上叠加

    对于“Jquery右下角弹出框提示,多个提示向上叠加”这一主题,我们可以深入探讨如何利用 jQuery 创建位于页面右下角的弹出提示框,并实现当有多个提示时,它们会向上叠加显示。 首先,我们需要创建一个基本的 HTML ...

Global site tag (gtag.js) - Google Analytics