javascript - How can I use jQuery to create a left and right sliding effect? -
i have following jquery code snippet:
var target1 = $('.div1'); var target2 = $('.div2'); target1.delay(1500).fadein(); target2.delay(3000).fadein(); // want use slide left here instead of .fadein()
similar .fadein()
there slide left/right option?
i found this i'm not sure how implement or if it's right one.
use code link posted.
include needed libraries (or use local copies):
<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>
add javascript page:
jquery.fn.extend({ sliderightshow: function(speed) { return this.each(function() { $(this).show('slide', {direction: 'right'}, +speed || 1000); }); }, slidelefthide: function(speed) { return this.each(function() { $(this).hide('slide', {direction: 'left'}, +speed || 1000); }); }, sliderighthide: function(speed) { return this.each(function() { $(this).hide('slide', {direction: 'right'}, +speed || 1000); }); }, slideleftshow: function(speed) { return this.each(function() { $(this).show('slide', {direction: 'left'}, +speed || 1000); }); } });
i added speed
parameter can specify how fast want animate.
and on, can use this:
$("#element_id").sliderightshow();