Menu icon Foundation
Orbit Motion UI EaseInOut

Any reason easing may not work when applied to Orbit? Applying the following, all parameters test fine except timing, no easing applied to the image transitions.

.orbit-slide-in-right {
	@include mui-slide($state:in,$direction:left,$amount:100%,$fade:true,$duration:0.6s,$timing:EaseInOut,$delay:null);
}

Orbitmotionuieasingtiming

Any reason easing may not work when applied to Orbit? Applying the following, all parameters test fine except timing, no easing applied to the image transitions.

.orbit-slide-in-right {
	@include mui-slide($state:in,$direction:left,$amount:100%,$fade:true,$duration:0.6s,$timing:EaseInOut,$delay:null);
}
Rafi Benkual 11 months ago

Have you instead tried passing in the animation through the data attribute? It works well for me

<div class="orbit" role="region" aria-label="Favorite Space Pictures" data-orbit data-options="animInFromLeft:fade-in; animInFromRight:fade-in; animOutToLeft:fade-out; animOutToRight:fade-out;">

Paul Summers 11 months ago

Well yes but there is no ease via those standard transitions? Currently state the class, e.g. data-options="animInFromLeft:orbit-slide-in-right but as i say, the $timing value is ignored.

 

lionel john 3 months ago

I am not much aware of these coding and programming ideas and didnt get a clear idea of the topic from here. It will be helpful to know more about the same if you are providing some more details on the topic. Hope that you will do it soon. fabric wholesalers


 

Taylor Shaw 3 months ago

I haven’t tried anything similar to it. So I’m not sure about the outcomes. If the function is applicable to another instances there is a good chance it could work with it. I recommend you try changing the values and try again. dc bus tours