閉じる

スライドメニュー「Sidr」にアイコンを追加 (レスポンシブ)

Categories | ホームページ

スライドメニュー「Sidr」の最終カスタマイズ。

closeにだけですが、アイコンを追加しました。

28 01 400x258 スライドメニュー「Sidr」にアイコンを追加 (レスポンシブ)

スライドメニューを開いた時、どのボタンで閉じるか戸惑いそうなので、

アイコン追加して目立たせた。どっかのサイトから貰っていたアイコンをSidr用に加工。

必要ならばコピペして使って下さい。

close スライドメニュー「Sidr」にアイコンを追加 (レスポンシブ)

 

参考まで(CSS)

 

.sidr-class-close a {
	background:url(../images/close.png) no-repeat;
	background-position:11px 15px;

}

.sidr-class-close a:hover {
	background: #00ffff url(../images/close.png) no-repeat;
	background-position:11px 16px;
}

 

以上

※ 最後の最後になりましたが、スマホ(アンドロイド)で検証してみたら、

いけてないことに気付きました。

スライドメニューを表示させ閉じるボタンをすると、画面サイズが固定され、

縦で使っていたスマホを横にしてみると、縦のサイズが依存されてしまう。

再読み込みすると元に戻るけど、これってブラウザによって違いがあるみたいだ。

Comment(0) | Trackback(0)

TAGS: / / / / / | 2015年2月28日 |