I'm using Mootools in a joomla site.
I want to do a basic banner rotator. Found a slider, SlideItMoo, that seems to mostly work.
But it seems to me the transitions are a bit jerky, especially at the end. Towards the end of a circ:out
or sine:out
transition, the new image takes noticable steps.
Maybe the problem is th开发者_Go百科at the time-slice is too large-grained. Is there a way for me to reduce that time-slice to make the entire process smoother? Or is there another way to make the transition appear smoother?
I'm using Mootools. Any solution really should focus on mootools; please don't suggest I switch to an alternative framework.
I don't know why the transitions appeared to be jerky to me. I did some analysis and graphed the transition curves, and didn't see anything really obvious.
I ended up building my own transition, which to my eye appeared to produce a smoother visual effect.
// Requirements for a transition function are:
// - it should be continuous on the interval [0,1]
// - f(0) = 0, and f(1)= 1 . f(x) between zero and 1
// may fall out of that range.
//
// To guarantee the f(x)=1 , I produce a fn for which f(0)=0,
// and f(1) is non-zero. Then I produce a second function which is the
// normalized transform of that, by simply using g(x)=f(x)/f(1), and
// use g(x) instead of f(x) as the transition function.
// This guarantees that g(1) = 1.
//
function fn1(x) {
return (Math.pow(x + 0.4, 3) * Math.sin((x - 0.5)*3.1415926));
}
function g(x) {
return fn1(x)/normalizationFactor;
}
normalizationFactor = fn1(1);
transitionCustom = new Fx.Transition(g);
精彩评论