先日「はてなブログのグローバルヘッダーをドロップダウンにする方法」を紹介しました。 その記事の中で、マウスカーソルが乗った時の動作を実装したのですが、これだと「タブレット」によるアクセスに対応できていませんでした。 そこで今回は、ドロップダウンをタップした時にも動作させる方法を紹介します。 はじめに 今回は「はてなブログのグローバルヘッダーをタブレットに対応させる方法」です。 私のサイトは、スマホとPCで別々のスタイル(CSS)を用意しているのですが、タブレットの場合は「PC用のCSS」が適用されるようになっています。 先日紹介した「ドロップダウン形式のグローバルヘッダー」もPCデザインで表示されます。 タブレットの場合、基本的にマウスカーソルという概念が存在しないため、ドロップダウンメニューがうまく動作しないんですよね。 そこで、過去に紹介したドロップダウンメニューのコードに「タップ処理
![【はてなブログ】ドロップダウンメニューをタブレットに対応させる!クリックで表示・非表示!](https://cdn-ak-scissors.b.st-hatena.com/image/square/168e1024ec545966c9e567fbdd50f4bf2ae09017/height=288;version=1;width=512/https%3A%2F%2Fclrmemory.com%2Fwp-content%2Fuploads%2F2019%2F05%2F20180306082836.png)