Bagaimanakah Saya Boleh Menghalang Bar Skrol daripada Bersembunyi pada Pad Jejak macOS dalam Penyemak Imbas WebKit/Blink?

Mencegah Penyembunyian Skrol Bar untuk Pengguna Pad Jejak macOS dalam WebKit/Blink

Dalam macOS sejak versi 10.7, penyemak imbas WebKit/Blink (cth., Safari , Chrome) secara automatik menyembunyikan bar skrol daripada pengguna pad jejak apabila tidak digunakan. Tingkah laku ini boleh mengaburkan isyarat visual penting untuk menentukan kebolehguliran elemen.

Gelagat WebKit Lalai:

Foo<br />
Bar<br />
Baz<br />
Help I'm trapped in an HTML factory!</p>
<p></div> </p>
<p><strong>Gelagat Presto (cth., Opera):</strong></p>
<p><div><pre class="brush:php;toolbar:false">Foo<br />
Bar<br />
Baz<br />
Help I'm trapped in an HTML factory!</p>
<p></div></p>
<p><strong>Penyelesaian: Memaparkan Bar Tatal Secara Kekal</strong></p>
<p>Untuk memaksa bar skrol kekal kelihatan dalam WebKit, manipulasi penampilannya menggunakan bar -webkit-scroll unsur pseudo:</p>
<p><strong>CSS:</strong></p>
<pre class="brush:php;toolbar:false">.frame::-webkit-scrollbar {
    -webkit-appearance: none;
}

.frame::-webkit-scrollbar:vertical {
    width: 11px;
}

.frame::-webkit-scrollbar:horizontal {
    height: 11px;
}

.frame::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white;
    background-color: rgba(0, 0, 0, .5);
}

.frame::-webkit-scrollbar-track {
    background-color: #fff;
    border-radius: 8px;
}

Keputusan:

Foo

Bar

Baz

Help I'm trapped in an HTML factory!

Dengan melumpuhkan tatal lalai penampilan bar dan menentukan gaya tersuai, kami memastikan bar skrol kekal kelihatan untuk pengguna pad jejak macOS.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghalang Bar Skrol daripada Bersembunyi pada Pad Jejak macOS dalam Penyemak Imbas WebKit/Blink?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn