モバイルサイトのトップページのナビゲーションメニューに表示されるグレー色の長い線が出て困っています。



  • ブログ名:アニキの脱サラカンパニー
    https://www.aniki-blog.com/
    2021年7月24日(土)14時頃
    自分のモバイルサイトを開いたところ、トップページのナビゲーションメニュー(横にスライドしてみる、うす緑メニュー)の下にいつの間にかグレー色の長い線が表示されるようになりました。
    Web、PCからサイトを開くと問題なく何故かモバイルサイトだけ上記の症状が現れます。
    お忙しいとは思いますが、何卒改善方法を教えて頂きたいでふす。宜しくお願い致します。0_1627129935747_Screenshot_20210724_155632_com.android.chrome.jpg


    マニュアル確認済み
    キャッシュクリア済み
    プラグイン全停止済み
    WordPressのバージョン : 5.8
    ご利用のサーバー名 : ConoHa WING
    PHPのバージョン : ?
    OS : Windows 10
    ご利用のブラウザ : Google モバイル
    該当サイトのURL : https://www.aniki-blog.com/


  • administrators

    @aniki-blog-com さん

    こんにちは。
    サイトの方を確認したところ、おそらくスクロールバーが表示されてしまっているのが原因だと思います。

    ブラウザがGoogle モバイルとのことなのですが、これはモバイル版のGoogle Chromeということであってますか??
    また他のブラウザで試すとどうなるかも合わせてご確認いただきたいです。

    お手数おかけしますが、宜しくお願いしますー!!



  • 返信ありがとうございます。

    ブラウザはモバイル版GoogleChromeです。

    MicrosoftEdgeで自分のサイトを開いてみたところ、同じく長いスクロールバーが表示されるのですが、動かしている間のみ何故か消えます。

    GoogleChromeの場合は動かしてもは表示されっぱなしです。
    昨日の午後から急に表示されるようになりました。
    ちなみにYahoo!で検索してサイトを開いてもGoogleChromeと同じ症状が現れます。



  • @aniki-blog-com さん

    こんにちは!

    今こちらの環境で確認したところ、スクロールバーが表示されるのは
    左右に動かしている時だけのようですが、その後も常に表示されている状況でしょうか??

    ( ※ 確認した環境 ... iOS の Google Chrome と Safari )

    よろしくお願いいたします。



  • こんにちは!
    ご確認して頂きありがとうございます。
    やはりスクロールバーは表示されっぱなしになっています。

    私のモバイルはAndroidを使用してGoogleChromeでサイトを開いています。
    Android端末でスライド(横)のスクロールバーを非表示する方法があれば良いのですが。。



  • @aniki-blog-com さん

    ご返信ありがとうございます!

    「カスタマイザー」の「追加CSS」に以下を追加することで変化は有りますでしょうか?

    @media (max-width: 767px) {
    	.cps-sp-menu-bar::-webkit-scrollbar {
    		display: none;
    	}
    }
    

    こちらで再現した環境では、スライド(横)のスクロールバーを非表示が出来たのですが。。。
    (ただ、動かしている時もスクロールバーは非表示になります。)

    お手数おかけしますが、よろしくお願いいたします!



  • @Tsuno_ さん
    ブログのCSSにコードを追加したところ、無事に元のトップページ画面に戻る事が出来ました。
    長いスクロールバーが出てきた原因がGoogleChromeブラウザなのかAndroidの方なのかが分かりませんが、教えて頂きありがとうございます!0_1627685503190_Screenshot_20210731_074928_com.android.chrome.jpg



  • @aniki-blog-com さん

    良かったです!

    ブラウザのアップデートなどで状況が変わったりすると思いますが、
    引き続きよろしくお願いいたします!


 

});