我正在为我的移动网站使用zepto库.我最近才知道zepto没有像
jquery一样的slideDown()插件.我想为zepto执行相同的操作.
我在jsfiddle(http://jsfiddle.net/goje87/keHMp/1/)上尝试过一个.这里不显示元素的动画.它只是闪烁下来如何引入动画?
PS:我不能提供一个固定的高度,因为我将这个插件应用到高度属性不知道的元素.
感谢在advace!
解决方法
演示:
http://jsfiddle.net/6zkSX/5
JavaScript的:
(function ($) { $.fn.slideDown = function (duration) { // get old position to restore it then var position = this.css('position'); // show element if it is hidden (it is needed if display is none) this.show(); // place it so it displays as usually but hidden this.css({ position: 'absolute',visibility: 'hidden' }); // get naturally height var height = this.height(); // set initial css for animation this.css({ position: position,visibility: 'visible',overflow: 'hidden',height: 0 }); // animate to gotten height this.animate({ height: height },duration); }; })(Zepto); $(function () { $('.slide-trigger').on('click',function () { $('.slide').slideDown(2000); }); });
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。