首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

弹出之3:JQuery.tipswindow

tipswindow是一个很一般的JQuery弹出插件,但使用简单,有相对漂亮的外观,代码比较通俗。...下面介绍使用方法: 1、首先引入该插件相关文件,分别是样式,JQuery库,该插件 <link href="tipswindown.css" rel="stylesheet" type="text/css...drag:  是否可以拖动(ture为是,false为否)             time: 自动关闭等待的时间,为空是则不自动关闭             showbg: [可选参数]设置是否显示遮罩<em>层</em>(...加载一个页面到框架显示: tipsWindown("标题","iframe:http://leotheme.cn","900","580","true","","true","leotheme"); 6.弹出一个不能拖动且没有遮罩背景的文本信息...: tipsWindown("提示","text:提示信息内容","250","150","false","","false","msg") 7.弹出一个不能拖动,三秒钟自动关闭的: tipsWindown

3.1K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    jQuery特效 | 导航底部横线跟随鼠标缓动

    HTML5学堂(码匠):jQuery来实现如下特效 - 在导航底部存在一条横线,跟随着鼠标缓动到相应导航项底部。...今天就针对该特效来说说如何开发(本次内容使用jQuery进行讲解,原生JavaScript代码下周一奉上) 功能效果图 ?...功能需求明确 横向导航条; 当鼠标移入导航区域的时候,在当前导航底部淡入一个横线; 当鼠标在导航区域当中左右移动时,横线跟随鼠标移动; 当鼠标移出导航区域的时候,横线淡出。...hover事件 hover事件是jQuery中的事件,不存在于原生JavaScript当中,是mouseover(鼠标移入)与mouseout(鼠标移出)的功能综合体; hover事件的基本语法为:...offsetLeft是JavaScript原生方法,ele.offsetLeft中,ele表示具体元素,元素的offsetLeft属性,表示该元素左侧与父级元素的距离; position()方法是jQuery

    8.7K50

    弹出之1:JQuery.Boxy (二)

    在《弹出之1:JQuery.Boxy (一)》中讲到了JQuery.Boxy的基本用法,本次讲下手动创建实例,new一个boxy对象是很容易的,传递一些参数对象就能满足不同的需求了。...modal:false}   //boxy属性设置                 );             });              5.1、弹出提问框...      Boxy.alert(message, callback, options)方法的3个参数message表示警告信息;callback为回调方法;options是boxy弹出框的的属性对象...相当于缓存选项传递到jQuery的Ajax方法。默认:false。 •过滤 - jQuery的表达式,用于过滤远程内容。...getInner() 返回一个jQuery对象包装对话框的内部区域-框架内包括标题栏一切。 getContent() 返回一个jQuery对象包装对话框的内容区域-框架内的一切,不包括标题栏。

    4K20

    弹出之1:JQuery.Boxy (一)

    Boxy是一个基于JQuery弹出插件,它有相对漂亮的外观,功能齐全,支持iframe,支持模式窗口但相对于同样的弹出插件BlockUI它明显笨重,但使用不那么方便。...1、下载并修改插件 可以在官网上下载到最新版(http://plugins.jquery.com/files/boxy-0.1.4.zip),到我写这些文字的时候最新版为0.1.4版,下载解压后有1个主要的...js文件:jquery.boxy.js;1个css文件;还有4个图片用于构成弹出的4个圆角。...m1为对应的要弹出的元素id;显示的元素默认如果设置为none时弹出将设置显示。  ...boxy"  action="Default.html" method="post">         <input id="Submit1"  type="submit" value="3.3、提交时显示<em>弹出</em><em>层</em>

    2.9K10

    前端-10款web动画插件

    2.基于Layui的可自定义添加删除数据的表格处理插件 如何在网页上编辑表格数据,这通过自己编写JS和CSS实现都是比较麻烦的,jQuery有很多插件可以完成这种功能,比如这款jQuery简易版的Excel...比如这款jQuery美化版复选框checkbox。...7.HTML5/CSS3超链接图片弹出动画 今天给大家分享一个基于HTML5和CSS3的超链接动画,这个HTML5应用还是比较实用的,它可以让你在鼠标滑过超链接时弹出图片,就像弹出tooltip那样的动画效果...因为用上了一些CSS3的动画属性,所以这个超链接图片弹出动画有很多种,你也可以自己尝试定义一些新的动画效果。 ?...我想知道有多少人,是直接滑到下面来看获取方式的! 哈哈~快给我点小心心

    5.9K50

    滚动穿透的6种解决方案【已自测】

    在移动端中,如果我们使用了一个固定定位的遮罩,且其下方的dom结构的宽度|高度超出屏幕的宽度|高度,那么即使遮罩弹出后铺满了整个屏幕,其下方的dom结构依然可以滚动,这就是大家所说的“滚动穿透”。...css添加弹的超出滚动效果 ? 局限问题: 弹中内容滚动到顶部或底部后,还会连带页面body一起滚动。也就是还会发生穿透效果。...真正的问题是当我们滑动弹窗可滚动区域,把可滚动区域的内容上滑到底部或下拉到顶部后,再触发弹窗可滚动区域准备滑动,此时的背景页面就会跟随滚动。真是恐怖。...4、如果手势是向上滑,且页面现在滚动的位置刚好是整个可滚动高度——弹窗内容可视区域高度的值,说明上滑到底,阻止默认事件。...问题局限: 不好的点就是没有原生滚动条那种效果,一点也不灵动,只能鼠标移动多少、可滚动区域挪动多少。

    13.7K31

    手把手教你超可爱的导航栏

    前期准备 虽然这个控件很小,功能也不是很多,但我们还是需要先分析一下它的结构,以及实现的功能 鼠标移入对应的列表项,底部的线会滑到相应的位置 点击相应的列表项,背景滑块会切换到所选择的列表项 <!...实现功能:鼠标移入对应的列表项,底部的线会滑到相应的位置 由于导航条中的项目过多,在后面查找对应元素索引时会比较麻烦,所以我们先给所有的列表项添加一个自定义属性data-index来代表他们的索引...left值, 这里通过事件委托来实现,通过获取触发事件的index属性来计算left值,当鼠标移出导航栏时,由于没有选择其他的项,所以线条需要回到原先被选中元素的位置 //鼠标移入底下的线跟着移动 slipNav.addEventListener...-- 底部线条 --> <!

    74330

    layui弹出html,layer弹出「建议收藏」

    jquery layer怎么弹出指定的html内元素 一个基本的弹出应该满足以下需CSS布局HTML小编今天和大家分享: 点击按钮/链接触发弹出弹出应该有半透明的遮罩; 点击弹出的关闭按钮...、取消按钮或者遮罩会关闭隐藏弹出; 使用Esc键也可以关闭弹出; 它是响应式的,并且兼容现代主流浏览器。...layer弹出表单的数据使用layer.js做弹出时,在弹出里直接提交form表单,返回的画面仍然停留在弹出里。...我们想在弹出里提交form表单后关闭弹出,并跳转到另一个画面。 引用layer.js后 弹窗为什么会在页面最底部出现 这个要看layer中content的内容了 /。...如何设置jquery layer弹窗弹层位置 layer插件如何弹出自定义div? 用了webuploader,想要点击按钮弹出文件上传窗口。

    19.1K30

    jsonp跨域实现的几种方式

    jsonp快速入门: 【原创】说说JSON和JSONP,也许你会豁然开朗,含jQuery用例 关于jquery.ajax的jsonp方法是用以及其error回调函数不能正确执行,请参考园长dudu...的文章: jquery ajax中使用jsonp的限制 jQuery插件jQuery-JSONP使用注意 其他有关jsonp的文章: 利用iframe实现ajax 跨域通信的解决方案...但是总不能把一堆关键字放到前台让用户看,至少得跟百度一样,可以用鼠标和键盘方向键从候选词框里选词吧。...同时监控空格、退格、Delete、Enter等键; 鼠标移入弹出层高亮选中的行,点击可上屏; 按键盘上下方向键可以选择候选词,回车提交跳转到百度搜索页面; 点击页面其他部位自动隐藏弹出框; 按ESC键隐藏弹出框...$("#searchText").get(0).blur(); } } else if (keyCode == 27) { //按下Esc 隐藏弹出

    3.4K20
    领券