スマホメニューがうまく閉じません。

スマホメニュー（右上に三本線or×ボタン）の
開け閉めがうまくできません。

前提・実現したいこと

レスポンシブ対応をしようとして、
900px以下の画面になると、スマホメニューが表示される（最初はclose状態）ようにしたいのです。

発生している問題・エラーメッセージ

メニュー画面の表示と、×ボタンは表示できたものの、×を押してもうまく動きません。

該当のソースコード

java
1
2/*CSSのほう*/
3/*三本バーアイコン*/
4#menubar_hdr.close {
5	background: url(../img/navi/icon_menu_close.png) no-repeat center/60%;
6}
7/*閉じるアイコン*/
8#menubar_hdr.open {
9	background: url(../img/navi/icon_menu_open.png) no-repeat center/60px;
10}
11

index側には以下を追加しています。

java
1/*HTML (navi-sがスマホメニュー）*/
2<script type="text/javascript" src="js/openclose.js"></script>
3
4/*中略*/
5	<!--メニュー開閉ボタン-->
6	<div id="menubar_hdr" class="close"></div>
7	
8	<!--メニューの開閉処理条件設定　700px以下-->
9	<script>
10		if (OCwindowWidth() <= 700) {
11			open_close("menubar_hdr", "navi-s");
12		}
13	</script>
14
15