--- a/mobile/chrome/content/browser.js
+++ b/mobile/chrome/content/browser.js
@@ -2196,47 +2196,63 @@ function showDownloadManager(aWindowCont
   // TODO: select the download with aID
 }
 
 var AlertsHelper = {
   _timeoutID: -1,
   _listener: null,
   _cookie: "",
   _clickable: false,
+  _container: null,
+  get container() {
+    if (!this._container) {
+      this._container = document.getElementById("alerts-container");
+      let self = this;
+      this._container.addEventListener("transitionend", function() {
+        self.alertTransitionOver();
+      }, true);
+    }
+    return this._container;
+  },
 
   showAlertNotification: function ah_show(aImageURL, aTitle, aText, aTextClickable, aCookie, aListener) {
     this._clickable = aTextClickable || false;
     this._listener = aListener || null;
     this._cookie = aCookie || "";
 
     document.getElementById("alerts-image").setAttribute("src", aImageURL);
     document.getElementById("alerts-title").value = aTitle;
     document.getElementById("alerts-text").textContent = aText;
-
-    let container = document.getElementById("alerts-container");
+    
+    let container = this.container;
     container.hidden = false;
-
-    let rect = container.getBoundingClientRect();
-    container.top = window.innerHeight - (rect.height + 20);
-    container.left = window.innerWidth - (rect.width + 20);
+    container.height = container.getBoundingClientRect().height;
+    container.classList.add("showing");
 
     let timeout = Services.prefs.getIntPref("alerts.totalOpenTime");
     let self = this;
+    if (this._timeoutID)
+      clearTimeout(this._timeoutID);
     this._timeoutID = setTimeout(function() { self._timeoutAlert(); }, timeout);
   },
-
+    
   _timeoutAlert: function ah__timeoutAlert() {
     this._timeoutID = -1;
-    let container = document.getElementById("alerts-container");
-    container.hidden = true;
-
+    
+    this.container.classList.remove("showing");
     if (this._listener)
       this._listener.observe(null, "alertfinished", this._cookie);
-
-    // TODO: add slide to UI
+  },
+  
+  alertTransitionOver: function ah_alertTransitionOver() {
+    let container = this.container;
+    if (!container.classList.contains("showing")) {
+      container.height = 0;
+      container.hidden = true;
+    }
   },
 
   click: function ah_click(aEvent) {
     if (this._clickable && this._listener)
       this._listener.observe(null, "alertclickcallback", this._cookie);
 
     if (this._timeoutID != -1) {
       clearTimeout(this._timeoutID);

--- a/mobile/chrome/content/browser.xul
+++ b/mobile/chrome/content/browser.xul
@@ -548,17 +548,17 @@
           <richlistitem class="context-command" id="context-removebookmark" type="edit-bookmark" onclick="ContextCommands.removeBookmark();">
             <label value="&contextRemoveBookmark.label;"/>
           </richlistitem>
         </richlistbox>
       </vbox>
     </hbox>
 
     <!-- alerts for content -->
-    <hbox id="alerts-container" hidden="true" align="start" class="dialog-dark" top="0" left="0"
+    <hbox id="alerts-container" hidden="true" align="start" class="dialog-dark" bottom="0" right="0"
           onclick="AlertsHelper.click(event);">
       <image id="alerts-image"/>
       <vbox flex="1">
         <label id="alerts-title" value=""/>
         <description id="alerts-text" flex="1"/>
       </vbox>
     </hbox>
   </stack>

--- a/mobile/themes/core/browser.css
+++ b/mobile/themes/core/browser.css
@@ -1182,16 +1182,28 @@ pageaction:hover:active > vbox > .pageac
 }
 
 @media (max-width: 499px) {
   #alerts-container {
     width: 200px;
   }
 }
 
+#alerts-container {
+  -moz-transform: translatex(100%);
+  -moz-transition-property: -moz-transform;
+  -moz-transition-duration: 0.5s;
+  margin-bottom: 20px;
+  -moz-margin-end: 20px;
+}
+
+#alerts-container.showing {
+  -moz-transform: translatex(0);
+}
+
 #alerts-text {
   font-size: 18px !important;
   white-space: pre-wrap;
 }
 
 /* helperapp (save-as) popup ----------------------------------------------- */
 #helperapp-target {
   font-size: 18px !important;