41 lines
1.5 KiB
JavaScript
41 lines
1.5 KiB
JavaScript
export default class ATransitionEffect {
|
|
constructor() { }
|
|
collapsedEffect(e, c = null, maxHeight = null) {
|
|
var height = (maxHeight == null || e.scrollHeight <= maxHeight) ? e.scrollHeight : maxHeight;
|
|
var transition = e.style.transition;
|
|
e.style.transition = '';
|
|
requestAnimationFrame(function () {
|
|
e.style.height = height + 'px';
|
|
e.style.opacity = 1;
|
|
e.style.transition = transition;
|
|
requestAnimationFrame(function () {
|
|
e.style.height = 0 + 'px';
|
|
e.style.opacity = .3
|
|
});
|
|
});
|
|
var f = function (ev) {
|
|
if (ev.propertyName == "height") {
|
|
ev.target.classList.remove('show');
|
|
if (c != null) c.call();
|
|
}
|
|
ev.target.removeEventListener("transitionend", f, false);
|
|
};
|
|
e.addEventListener('transitionend', f, false);
|
|
}
|
|
expandEffect(e, c = null, maxHeight = null) {
|
|
e.style.opacity = 1;
|
|
e.style.height = ((maxHeight == null || e.scrollHeight <= maxHeight) ? e.scrollHeight : maxHeight) + 'px';
|
|
var f = function (ev) {
|
|
if (ev.propertyName == "height") {
|
|
ev.target.classList.add("show");
|
|
ev.target.style.height = null;
|
|
if (c != null) c.call();
|
|
ev.target.removeEventListener("transitionend", f, false);
|
|
}
|
|
}
|
|
e.addEventListener('transitionend', f, false);
|
|
}
|
|
fadeEffect(e, c) {
|
|
|
|
}
|
|
} |