JQuery jCarouselLite plugin with fade effect

Welcome all...

I want to use the fade effect with jCarouselLite qualities. Is it possible.

Needs:

  • Image transition time should be fast.
  • The image should remain for 10 seconds.

Can someone direct me to this please.

Gita.

+4
source share
4 answers

Umm ... maybe I misunderstood what you want. But what of what you requested is not yet supported by jCarousel Lite?

  • Attenuation effect: use the easing parameter (you need to enable the jQuery easing plugin ). Check out Custom Animation - Easing Demo (on the right side of the page).
  • Fast transition: the speed option (milliseconds) determines how quickly the transition is animated.
  • Show image for 10 seconds: auto . Thus, the carousel self-timer and the time you specify in milliseconds is the time between two consecutive slides.

Check out the demo: http://jsbin.com/etena/ (see code <a3> here )

+1
source

To disappear from Image to Image, rather than Image to White to Image, you must set the speed attribute to zero, for example.

 $('#content .slider .inner') .jCarouselLite( { afterEnd : function(el) { $(el).parent().fadeTo(500, 1); }, beforeStart : function(el) { $(el).parent().fadeTo(500, 0); }, speed : 0 } ); 
+6
source

You can not. With relief, you can only set the way in which it is a slide, but jCarousselLite will always be a slide.

Of course, you can change the default behavior for plugins to suit your specific needs. An example is here: http://snipplr.com/view/18326/jcarousellite-fade-animation/ (I did not test this, but it looked fine)

+1
source

You cannot do this with easing. Based on / simplifying what publicJorn wrote, here is a way to add a fadeIn / FadeOut effect on shift:

 $('div#foo').jCarouselLite({ visible: 1, start: 0, beforeStart: function(a) { $(a).parent().fadeTo(500, 0); }, afterEnd: function(a) { $(a).parent().fadeTo(500, 1); } }); 
0
source

Source: https://habr.com/ru/post/1304224/


All Articles