diff --git a/media/css/seahub.css b/media/css/seahub.css
index fbe9e3bb34..3d4537ce33 100644
--- a/media/css/seahub.css
+++ b/media/css/seahub.css
@@ -2098,7 +2098,7 @@ button.dropdown-toggle:focus {
 }
 #upload-menu .item {
     position:relative;
-    text-align:left;
+    white-space:nowrap;
     overflow:hidden; /* for 'hover', as long 'input' in it. */
 }
 .fixed-upload-file-dialog {
diff --git a/seahub/templates/js/templates.html b/seahub/templates/js/templates.html
index c0266fa3fa..4fc2ad9c49 100644
--- a/seahub/templates/js/templates.html
+++ b/seahub/templates/js/templates.html
@@ -105,16 +105,19 @@
         <input type="file" name="file" multiple />
     </div>
     <% if (enable_upload_folder) { %>
-    <ul id="upload-menu" class="hide">
-        <li class="item">
-        <span>{% trans "Upload Files" %}</span>
-        <input type="file" name="file" multiple />
-        </li>
-        <li class="item">
-        <span>{% trans "Upload Folder" %}</span>
-        <input type="file" name="file" multiple directory webkitdirectory />
-        </li>
-    </ul>
+    <div id="advanced-upload" class="dropdown dropdown-inline" style="display:none;">
+        <button class="dropdown-toggle op-btn">{% trans "Upload" %}</button>
+        <ul id="upload-menu" class="dropdown-menu hide">
+            <li class="item">
+            <span>{% trans "Upload Files" %}</span>
+            <input type="file" name="file" multiple />
+            </li>
+            <li class="item">
+            <span>{% trans "Upload Folder" %}</span>
+            <input type="file" name="file" multiple directory webkitdirectory />
+            </li>
+        </ul>
+    </div>
     <% } %>
     <button id="add-new-dir" class="op-btn">{% trans "New Folder" %}</button>
     <button id="add-new-file" class="op-btn">{% trans "New File" %}</button>
diff --git a/static/scripts/app/views/dir.js b/static/scripts/app/views/dir.js
index 0eb9d90622..98b26eae53 100644
--- a/static/scripts/app/views/dir.js
+++ b/static/scripts/app/views/dir.js
@@ -12,10 +12,11 @@ define([
     'app/views/dirent',
     'app/views/dirent-grid',
     'app/views/fileupload',
-    'app/views/share'
+    'app/views/share',
+    'app/views/widgets/dropdown'
     ], function($, progressbar, magnificPopup, simplemodal, _, Backbone, Common,
         FileTree, Cookies, DirentCollection, DirentView, DirentGridView,
-        FileUploadView, ShareView) {
+        FileUploadView, ShareView, DropdownView) {
         'use strict';
 
         var DirView = Backbone.View.extend({
@@ -205,6 +206,10 @@ define([
                 this.render_dirents_slice(this.dir.last_start, this.dir.limit);
 
                 this.fileUploadView.setFileInput();
+                this.upload_dropdown = new DropdownView({
+                    el: this.$('#advanced-upload')
+                });
+
                 this.getImageThumbnail();
             },
 
diff --git a/static/scripts/app/views/fileupload.js b/static/scripts/app/views/fileupload.js
index b0caaede44..ccb98c3e17 100644
--- a/static/scripts/app/views/fileupload.js
+++ b/static/scripts/app/views/fileupload.js
@@ -422,15 +422,6 @@ define([
                 window.location.href.replace(/\/repo\/[-a-z0-9]{36}\/.*/, app.config.mediaUrl + 'cors/result.html?%s')
             );
 
-            $(document).click(function(e) {
-                var target = e.target || event.srcElement;
-                var closePopup = function(popup, popup_switch) {
-                    if (!popup.hasClass('hide') && !popup.is(target) && !popup.find('*').is(target) && !popup_switch.is(target) && !popup_switch.find('*').is(target) ) {
-                        popup.addClass('hide');
-                    }
-                };
-                closePopup(dirView.$('#upload-menu'), dirView.$('#upload-file'));
-            });
         },
 
         events: {
@@ -476,7 +467,9 @@ define([
 
             if (dir.user_perm && dir.user_perm == 'rw' &&
                 'webkitdirectory' in $('input[type="file"]', upload_btn)[0]) {
-                upload_btn.find('input').remove().end().addClass('cspt');
+                upload_btn.remove();
+                $('#advanced-upload').removeAttr('style'); // show it
+
                 $('.item', upload_menu).click(function() {
                     popup.fileupload(
                         'option',
@@ -492,13 +485,6 @@ define([
                         $(this).css({'background':'transparent'});
                     }
                 );
-                upload_btn.click(function () {
-                    upload_menu.toggleClass('hide');
-                    upload_menu.css({
-                        'left': upload_btn.position().left,
-                        'top': parseInt(dirView.$('.repo-op').css('padding-top')) + upload_btn.outerHeight(true)
-                    });
-                });
             }
         }
     });