mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-30 13:29:56 +00:00
Code Issues Releases Wiki Activity

Animate modal message appearance

Browse Source
This commit is contained in:
Jeremy Ruston 2012-07-17 18:28:47 +01:00
parent 9c4ed18129
commit 41845ba059
1 changed files with 12 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
core/modules/utils/dom/modal.js
View File

@ -90,8 +90,20 @@ Modal.prototype.display = function(title) {
event.stopPropagation(); event.stopPropagation();
return false; return false;
},false); },false);
// Set the initial styles for the message
modalBackdrop.style.opacity = 0;
modalWrapper.style[$tw.browser.transformorigin] = "0% 0%";
modalWrapper.style[$tw.browser.transform] = "translateY(-500px)";
// Put the message into the document // Put the message into the document
document.body.appendChild(wrapper); document.body.appendChild(wrapper);
// Animate the styles
var d = $tw.config.preferences.animationDuration + "ms";
modalBackdrop.style[$tw.browser.transition] = "opacity " + d + " ease-out";
modalWrapper.style[$tw.browser.transition] = "-" + $tw.browser.prefix.toLowerCase() + "-transform " + d + " ease-in-out";
$tw.utils.nextTick(function() {
modalBackdrop.style.opacity = 1;
modalWrapper.style[$tw.browser.transform] = "translateY(0px)";
});
}; };
exports.Modal = Modal; exports.Modal = Modal;