<div id="page_begin_html">
        <div class="gs_html">
            <button class="gs" onclick="gs()"></button>
        </div>
　　</div>

之後在建立一個div這個是我們要進行操作的div元素

<div id="home">
    <div id="header">
        欄
    </div>
<div>

html樣式：

/* 收縮欄 */
#home{
    width: 200px;
    padding: 10px;
    position: relative;/*定位*/
    left: -240px;/*隱藏欄*/
    transition: all ease 0.5s;/*動畫生成*/
    background-color: rgb(248, 244, 239);
    border-radius: 0 6px 6px 0;/*欄圓邊*/
    box-shadow: 0 0 2px 2px #CCCCD8;/*邊框陰影*/
}

JavaScript樣式：

建立一個元素 gstis 賦值一個 true 給他

之後獲取我們的要操作的 div 元素區域

然後對 gstis 進行判斷他是否為 true

為 true 就將div元素整體放回原位就可以，之後在將 false 賦值給 gstis

else 就將div元素整體進行隱藏

var gstis = true;
function gs() {
    var a = document.getElementById("home");
    if (gstis == true) {
        a.style.left = 0;
        gstis = false;
    } else {
        a.style.left = -240 + "px";
        gstis 
 
= true;
    }

}