javascript banner - 关闭按钮并不能正常工作

Question

我制作了一个javascript横幅，它在展开时展开，在点击按钮时关闭。当横幅仍在扩展时，我无法关闭它。当我点击关闭按钮时，横幅会展开，并且只有在它开始关闭后才会展开。我认为它是关于明确的间隔，但我不知道如何解决问题。谁能帮我？

＆＃13;

＆＃13;

    var dagContainer = document.querySelector('.dag_sideslider');
    var side_btn = document.querySelector('.side_btn');
    var close_btn = document.querySelector('.dag_close');
    side_btn.addEventListener("mouseover", open);
    close_btn.addEventListener("click", closeBanner);

function open() {

    side_btn.style.display = "none";
    close_btn.style.display = "block";
    var pos = 300;
    var id = setInterval(frame, 5);

    function frame() {
        if (pos == 900) {
            clearInterval(id);
        } else {
            pos++;
            dagContainer.style.width = pos + 'px';
        }
    }
}

function closeBanner() {

    close_btn.style.display = "block";
    var idd = setInterval(framee, 5);

    function framee() {

        var poss = dagContainer.offsetWidth;
        console.log(poss);
        if (poss == 300) {
            clearInterval(idd);
            console.log("ss");
            close_btn.style.display = "none";
            side_btn.style.display = "block";
        } else {
            poss--;
            console.log(poss)
            dagContainer.style.width = poss + 'px';
            console.log(poss);
        }
    }
}

＆＃13;

		.slideSider_container{
			margin:0 auto 0;
			position: relative;
			width: 300px;
			height: 600px;
		}
		.dag_sideslider{
			background-color:#ea7900;
			width: 300px;
			height: 600px;
			position: absolute;
			right: 0;
			top:0;		
		}
		.side_btn{
			width: 300px;
			height: 600px;
		}
		.dag_close{
			position: absolute;
			top:0px;
			right: 0px;
			z-index:9999;
			display: none
		}

＆＃13;

<div class="slideSider_container">
	<div class="dag_sideslider" >
		<div class="dag_close"><img src="close.png"></div>
		<div class="side_btn"></div>
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;