jQuery提供了一些默认的动画 控制元素的显示与隐藏 show() hide() 控制元素的透明度 fadeIn() fadeOut() 控制元素的高度 slideUp() slideDown() 自定义动画 animate()
语法:
$("selector").show([speed],[callback]);
参考描述:
参数一:速度,可选 例如:1000毫秒等等与1秒 fast slow normal
参数二:回调函数,可选 show或hide函数执行完之后,要实行的函数
$(function () { $(".nav-ul li").on({"mouseover":function () { $(this).css("background","pink") },"mouseout":function () { $(this).css("background","#ff2832") }}); $(".menu-btn").hover(function () { $(this).next().show("fast") },function () { $(this).next().hide("slow") }) })
语法:
$("selector").fadeIn([speed],[callback]); $("selector").fadeOut([speed],[callback]);
参考描述:
参数一:速度,可选 默认是0 例如:1000毫秒等等与1秒 fast slow normal
参数二:回调函数,可选 fadeIn或fadeOut执行完以后函数执行完之后,要实行的函数
$(function () { $("input[name='fadein_btn']").click(function () { $("img:eq(0)").fadeIn(500,function () { alert("淡入成功") }) }) $("input[name='fadeout_btn']").click(function () { $("img:eq(0)").fadeOut(1000,function () { alert("淡出成功") }) }) })
slideDown()
使元素逐渐延伸显示
slideUp()
使元素逐渐缩短直至隐藏
语法:
$("selector").slideUp([speed],[callback]); $("selector").slideDown([speed],[callback]);
参考描述:
参数一:速度,可选 默认是0 例如:1000毫秒等等与1秒 fast slow normal
参数二:回调函数,可选 slideUp或slideDown执行完以后函数执行完之后,要实行的函数
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
长按识别二维码并关注微信
更方便到期提醒、手机管理