当前位置:  编程技术>jquery

Jquery实现显示隐藏动态效果的例子

    来源: 互联网  发布时间:2014-09-03

    本文导语:  hide()   隐藏匹配对象 Hello AgainjQuery 当点击连接时,id为a的对象的display变为none。 show() 显示匹配对象 hide(speed)   以一定的速度隐藏匹配对象,其大小(长宽)和透明度都逐渐变化到0,speed有3级("slow", "normal",   "fast"),也可以...

hide()   隐藏匹配对象

Hello Again

jQuery 当点击连接时,id为a的对象的display变为none。

show() 显示匹配对象
hide(speed)   以一定的速度隐藏匹配对象,其大小(长宽)和透明度都逐渐变化到0,speed有3级("slow", "normal",   "fast"),也可以是自定义的速度。
show(speed)   以一定的速度显示匹配对象,其大小(长宽)和透明度都由0逐渐变化到正常
hide(speed, callback)   show(speed, callback) 当显示和隐藏变化结束后执行函数callback

toggle()   
toggle(speed) 如果当前匹配对象隐藏,则显示他们,如果当前是显示的,就隐藏,toggle(speed),其大小(长宽)和透明度都随之逐渐变化。

jQuery
fadeIn(speeds)    fadeOut(speeds)   根据速度调整透明度来显示或隐藏匹配对象,注意有别于hide(speed)和show(speed),fadeIn和fadeOut都只调整透明度,不调整大小
jQuery 点击连接后可以看到图片逐渐显示。
fadeIn(speed, callback)   fadeOut(speed, callback)   
callback为函数,先通过调整透明度来显示或隐藏匹配对象,当调整结束后执行callback函数

jQuery
点击连接后可以看到图片逐渐显示,显示完全后弹出对话框

fadeTo(speed, opacity, callback)   将匹配对象以speed速度调整倒透明度opacity,然后执行函数callback。Opacity为最终显示的透明度(0-1).


jQuery
如果不用jQuery,编写原始javascript脚本可能很多代码!

slideDown(speeds)   将匹配对象的高度由0以指定速率平滑的变化到正常!

jQuery
slideDown(speeds,callback)   将匹配对象的高度由0变化到正常!变化结束后执行函数callback
slideUp("slow")   slideUp(speed, callback) 匹配对象的高度由正常变化到0
slideToggle("slow") 如果匹配对象的高度正常则逐渐变化到0,若为0,则逐渐变化到正常

以上就是有关使用Jquery实现显示与隐藏的方法与示例,希望对大家有所帮助。


    
 
 

您可能感兴趣的文章:

  • JQuery转义id中特殊字符的例子
  • jquery检测浏览器名称和版本信息的例子
  • jQuery.proxy向函数中传参的小例子
  • jQuery提交多个表单的小例子
  • jquery获得url参数列表的例子
  • jQuery查看事件内容的小例子
  • jQuery循环array与map小例子
  • jquery 绑定、捕获、拦截回车事件的例子
  • jquery转化Datatable为json数据的例子
  • jquery 获取URL请求参数的小例子
  • jquery 文字上下滚动的小例子
  • jquery链式操作、链式写法的小例子
  • jquery hide方法隐藏元素的例子
  • jquery判断浏览器后退时弹出消息的例子
  • jQuery为checkbox、radio赋值的例子
  • jquery隐藏标签、显示标签的例子
  • JQuery checkbox全选的小例子
  • jQuery判断checkbox是否选中的小例子
  • jQuery元素属性attr设置多个键值的例子
  • jQuery 随机展示图片的例子
  • jQuery显示隐藏密码插件 jquery.toggle-password
  • jquery控制css的display属性(显示与隐藏)
  • jquery显示与隐藏div的方法示例
  • jQuery判断元素显示与隐藏
  • jquery控制css元素的display(显示与隐藏)属性
  • jquery控制css display属性(控制元素显示与隐藏)
  • jquery响应鼠标事件 jquery隐藏与显示input默认值
  • jquery hide与show方法隐藏与显示标签
  • jquery实现div层的隐藏或显示
  • jquery显示、隐藏div的方法举例
  • 页面元素绑定jquery toggle后元素隐藏的解决方法
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • jQuery滚动效果插件 jQuery.SerialScroll
  • jQuery照明效果插件 jQuery Photon
  • jQuery实现CSS3动画效果的插件 jQuery Transit
  • jQuery盖章效果插件 jquery.stamper
  • jQuery卷页效果 jQuery Page Peel
  • 链接渐变效果 jQuery glow
  • 操作系统 iis7站长之家
  • jQuery Lightbox效果插件 Boxer
  • jQuery滚动延迟效果插件 AnimateScroll
  • jQuery电梯式滚动效果插件 Ascensor
  • jQuery 页面动画效果 Animsition
  • jQuery 幻灯片效果插件 plusview
  • jQuery图片效果切换 Adipoli
  • jQuery 幻灯效果显示插件 Diapo
  • jQuery文本效果插件 Textualizer
  • jQuery在iPhone/iPad的滚动效果处理 Overscroll
  • jQuery轮盘效果插件 Roundabout
  • jQuery淡入淡出效果 InnerFade
  • jQuery图片缩放效果 FancyZoom
  • jQuery图片幻灯手风琴效果插件 Slidorion
  • 通过javascript库JQuery实现页面跳转功能代码
  • jQuery鼠标动画插件 jquery-ahover
  • jQuery概述,代码举例及最新版下载
  • jQuery向导插件 Jquery Wizard Plugin
  • Jquery操作html复选框checkbox:全选,全不选和反选
  • jQuery圆角插件 jQuery Corners
  • struts+spring+hibernate+jquery实现分页功能的几个基本类介绍(异步加载)
  • jQuery相册插件 jQuery.popeye
  • jQuery UI组件 jQuery UI
  • jQuery右键菜单插件 jQuery ContextMenu
  • jQuery分页插件 Pagination jQuery Plugin


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3