我用一些类似于 slideUp( )
和 slideDown()
如下所示。但是,我还想实现 slideLeftShow()
和 slideRightHide()
。
我知道有大量的库提供这种类型的东西(我想避免添加另一大组 javascript
文件),但是任何人都可以提供一个简单的例子来说明如何实现slideLeftShow()
还是 slideRightHide()
?
jQuery.fn.extend({
slideRightShow: function() {
return this.each(function() {
jQuery(this).animate({width: 'show'});
});
},
slideLeftHide: function() {
return this.each(function() {
jQuery(this).animate({width: 'hide'});
});
},
slideRightHide: function() {
return this.each(function() {
???
});
},
slideLeftShow: function() {
return this.each(function() {
???
});
}
});
上面的 slideRightShow
函数从左侧开始显示图像,然后向右侧显示。 我正在寻找某种方法来做同样的事情,但从右侧开始并向左侧推进。谢谢!
编辑
jQuery Interface 有一些我需要的东西(我基本上需要他们的“向右滑入”和“向左滑出”功能),但我无法让它与 jQuery 1.3 一起工作:http://interface.eyecon.ro/demos/ifx.html .此外,他们的演示似乎已损坏,并且在抛出一百万个错误之前只会做一次幻灯片。
最佳答案
此功能包含在 jquery ui 中 http://docs.jquery.com/UI/Effects/Slide如果你想用你自己的名字扩展它,你可以使用它。
jQuery.fn.extend({
slideRightShow: function() {
return this.each(function() {
$(this).show('slide', {direction: 'right'}, 1000);
});
},
slideLeftHide: function() {
return this.each(function() {
$(this).hide('slide', {direction: 'left'}, 1000);
});
},
slideRightHide: function() {
return this.each(function() {
$(this).hide('slide', {direction: 'right'}, 1000);
});
},
slideLeftShow: function() {
return this.each(function() {
$(this).show('slide', {direction: 'left'}, 1000);
});
}
});
您将需要以下引用资料
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.core.js"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.slide.js"></script>
关于jQuery 向左滑动并显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/521291/