ボタンへ移動
disable.page

最初 sticky

画面に張り付いたものを外す

メニューや通知が画面の一部をずっと覆っているとき、固定された要素をページの通常の流れに戻し、読むための場所を広げます。

パソコンで下のボタンをブックマークバーにドラッグします。その後、対象のページを開いてブックマークを使ってください。

固定要素を外す

スマートフォンをお使いですか? 下に別の使い方をまとめています。

仕組みと使いどころ

スマートフォンではどう使いますか?

コードをブックマークのアドレスとして保存する方法を試せます。まず下のコードをコピーしてください。

iPhone(Safari): 適当なページをブックマークし、そのブックマークを長押しして「編集」を選び、アドレスをコピーしたコードに置き換えます。

Android(Chrome): ページをブックマークします。ブックマーク一覧で横の三点メニューから「編集」を選び、アドレスをコピーしたコードに置き換えます。

変更したいページを開いて、そのブックマークを選びます。メニューから動かない場合は、アドレスバーにブックマーク名を入力し、表示された候補を選んでください。

動作はブラウザーやバージョンによって異なります。ページ側でこの方法がブロックされることもあります。

iPhoneでは「ショートカット」アプリも使えます

「ショートカット」アプリで「WebページでJavaScriptを実行」アクションを追加し、下のコードを貼り付けます。SafariのWebページ用に共有シートへの表示を有効にします。求められた場合は、ショートカットの設定でスクリプトの実行を許可してください。次にSafariで対象のページを開き、共有から作成したショートカットを選びます。

パソコンのコンソールではどう使いますか?

変更したいページを開きます。Chromeで Ctrl + Shift + J(Windows/Linux)または ⌘ + Option + J(Mac)を押し、下のコードをコンソールに貼り付けて Enter を押します。

効果は開いているページに適用されます。コンソールで実行する前にコードの内容を確認してください。ブラウザーが安全上の警告を表示する場合もあります。

ボタンは position が fixed または sticky のものを探し、static を求めます。クリックした時点でページにあるものに効きます。

文章の上から離れるのは何ですか?

多くのサイトは、メニューや通知やチャットのボタンをウィンドウに固定します。読んでいるものの上に重なります。

ボタンは要素を見ます。計算された位置が fixed または sticky なら、ページの普通の流れに戻すよう求めます。

アカウントの設定でも、サイトの変更でもありません。読み込み直すと、バーは再び張り付きます。ブックマークはそのまま使えます。

外すもの

スクロールについてくるメニュー、通知、フッター、ボタンです。ウィンドウに固定されているものが対象です。

上のヘッダーだけを外したいときは、固定ヘッダーのツールを使います。こちらは残りも外します。

起きうること

バーは浮かず、文章の中に場所を取ります。覆っていた領域が空くのはそのためです。

クリックのあとでページが作った要素は、再び張り付くことがあります。もう一度クリックしてください。