diff --git a/assets/js/expandcode.js b/assets/js/expandcode.js
index 17677265ec..d2a47d3e25 100644
--- a/assets/js/expandcode.js
+++ b/assets/js/expandcode.js
@@ -1,10 +1,15 @@
+const tExpand='<i class="fa fa-expand"></i><span class="sr-only">Expand</span>'
+const tCollapse='<i class="fa fa-compress"></i><span class="sr-only">Shrink</span>'
+
 function toggle_cs(eo) {
-    const wrapper = $(eo.target).parent();
+    const wrapper = $(eo.target).closest(".code_sample");
     const code_el = wrapper.find("code");
     code_el.toggleClass('expanded');
     const placeholders = wrapper.find(".code-placeholder");
     if (placeholders.length) {
+        // collapsing
         placeholders.remove();
+        $(window).scrollTop(code_el.offset().top - 124)
     } else {
         code_el.after("<div class='code-placeholder' style='width:"
                             + code_el.outerWidth()
@@ -12,8 +17,8 @@ function toggle_cs(eo) {
                             + code_el.outerHeight()
                             + "px;'>&nbsp;</div>");
     }
-    current_button_text = wrapper.find(".code_toggler").val();
-    $(eo.target).val(current_button_text == 'Expand' ? "Collapse" : "Expand");
+    current_button_expanded = code_el.hasClass('expanded');
+    $(wrapper.find(".code_toggler")).html(current_button_expanded ? tCollapse : tExpand);
 }
 
 function has_scrollbars(e) {
@@ -39,7 +44,7 @@ function make_code_expandable() {
       if (has_scrollbars(this)) {
         jqThis.dblclick(toggle_cs);
         jqThis.attr('title', 'Double-click to expand/collapse');
-        var newbtn = $("<input type='button' class='code_toggler btn btn-outline-secondary' value='Expand' />");
+        var newbtn = $(`<button class='code_toggler btn btn-outline-secondary'>${tExpand}</button>`);
         newbtn.appendTo(jqThis.parents(".code_sample"));
       }
     });