Fixes QRCode style

 * fixes a regression misplacing QRCode popup.
 * adds a 'show' class in JS to handle CSS transition.

1 files changed, 8 insertions, 2 deletions

diff --git a/plugins/qrcode/shaarli-qrcode.js b/plugins/qrcode/shaarli-qrcode.js
index 0a8de21d..615f54c7 100644
--- a/plugins/qrcode/shaarli-qrcode.js
+++ b/plugins/qrcode/shaarli-qrcode.js
@@ -19,7 +19,7 @@ function showQrCode(caller,loading)
     
     // Build the div which contains the QR-Code:
     var element = document.createElement('div');
-    element.id="permalinkQrcode";
+    element.id = 'permalinkQrcode';
 
         // Make QR-Code div commit sepuku when clicked:
     if ( element.attachEvent ){
@@ -37,6 +37,12 @@ function showQrCode(caller,loading)
         element.appendChild(image);
         element.innerHTML += "<br>Click to close";
         caller.parentNode.appendChild(element);
+
+        // Show the QRCode
+        qrcodeImage = document.getElementById('permalinkQrcode');
+        // Workaround to deal with newly created element lag for transition.
+        window.getComputedStyle(qrcodeImage).opacity;
+        qrcodeImage.className = 'show';
     }
     else
     {
@@ -48,7 +54,7 @@ function showQrCode(caller,loading)
 // Remove any displayed QR-Code
 function removeQrcode()
 {
-    var elem = document.getElementById("permalinkQrcode");
+    var elem = document.getElementById('permalinkQrcode');
     if (elem) {
         elem.parentNode.removeChild(elem);
     }