Rumah hujung hadapan web tutorial js js取滚动条的尺寸的函数代码_javascript技巧

js取滚动条的尺寸的函数代码_javascript技巧

May 16, 2016 pm 05:58 PM
saiz bar skrol

这个比较简单,做个记录而已。

创建一个嵌套节点,让外层节点产生滚动条,然后用offsetWidth - clientWidth即可获得滚动条宽度。需要注意的是为了避免页面抖动,可以设置外层元素position:absolute和visibility:hidden

参考:

复制代码 代码如下:

function getScrollWith(){
var wrap = setAttributes(document.createElement('div'),{
style : {
width : '200px',
height: '200px',
overflow: 'auto',
position:'absolute',
visibility:'hidden'
}
})
var inner = setAttributes(document.createElement('div'),{
style : {
width : '100px',
height: '2000px'
}
})
document.body.appendChild(wrap);
wrap.appendChild(inner);
var w = wrap.offsetWidth - wrap.clientWidth;
document.body.removeChild(wrap);
wrap = null;
inner = null;
return w;
}
function setAttributes(elem,opts){
for(var key in opts){
if(typeof opts[key] == 'string'){
elem[key] = opts[key];
}else{
if(!elem[key]){
elem[key] = {};
}
setAttributes(elem[key],opts[key]);
}
}
return elem;
}
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

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Microsoft membawa bar skrol Fasih Windows 11 ke Google Chrome Microsoft membawa bar skrol Fasih Windows 11 ke Google Chrome Apr 14, 2023 am 10:52 AM

Tidak seperti Windows 10, Windows 11 menampilkan "bar skrol cecair" moden baharu yang berubah bentuk apabila pengguna berinteraksi dengannya. Bar skrol fasih bersifat dinamik, ia berskala secara automatik dalam faktor bentuk yang berbeza atau apabila anda menukar saiz tetingkap, dan pada masa ini ia digunakan dalam apl seperti Tetapan, Pemain Media dan banyak lagi. Google Chrome mungkin mempunyai fungsi bar skrol yang lancar tidak lama lagi, menurut cadangan baharu daripada Microsoft. Microsoft mengatakan dalam cadangan bahawa mereka mahu memodenkan bar skrol lama dalam Chrome

Apakah saiz kertas a4 dalam sentimeter? Apakah saiz kertas a4 dalam sentimeter? Feb 11, 2024 pm 11:51 PM

Kertas A4 kini digunakan di banyak tempat, seperti pejabat, belajar, dan lain-lain. Kertas yang digunakan untuk menyalin pada dasarnya adalah kertas A4 Ramai rakan tidak tahu berapa sentimeter saiz kertas A4. 1. Saiz kertas A4 ialah 21cm × 29.7cm (210mm × 297mm Saiz kertas yang digunakan di kebanyakan negara di dunia menggunakan piawaian antarabangsa ini). 2. Asal kertas A4 ialah 210mm×297mm. Sebab 1: Segi empat tepat dengan panjang 2 dan lebar Nisbah yang terhasil ialah . Walau bagaimanapun, 297 dibahagikan dengan 210, hasilnya ialah 1.414, iaitu hampir dengan, dan nisbah ini betul-betul sekeping kertas

Bagaimana untuk mengira saiz komputer Bagaimana untuk mengira saiz komputer Mar 20, 2023 pm 01:43 PM

Cara mengira saiz komputer: 1. Cari meja rata dan stabil, letakkan monitor di atas meja, dan pastikan monitor stabil 2. Gunakan pembaris untuk mengukur panjang pepenjuru 3. Tukar unit antara sentimeter dan kaki; hanya mengira saiz monitor.

Bagaimana untuk menyembunyikan penatalan bar skrol dalam tindak balas Bagaimana untuk menyembunyikan penatalan bar skrol dalam tindak balas Dec 21, 2022 pm 03:38 PM

Bagaimana untuk menyembunyikan skrol bar skrol dalam bertindak balas: 1. Buka fail "react-native" yang sepadan 2. Tetapkan skrol mendatar melalui mendatar 3. Sembunyikan bar skrol mendatar dengan menetapkan nilai "showsHorizontalScrollIndicator" kepada "false".

Cara menetapkan bar skrol agar sentiasa dipaparkan pada sistem Mac - Cara menetapkan bar skrol agar sentiasa dipaparkan Cara menetapkan bar skrol agar sentiasa dipaparkan pada sistem Mac - Cara menetapkan bar skrol agar sentiasa dipaparkan Mar 18, 2024 pm 06:22 PM

Baru-baru ini, beberapa rakan telah merujuk kepada editor tentang cara menetapkan bar skrol sistem Mac untuk sentiasa dipaparkan . Langkah 1: Dalam menu mula sistem, pilih pilihan [System Preferences]. Langkah 3: Pada halaman Keutamaan Sistem, pilih pilihan [Umum]. Langkah 3: Pada halaman umum, pilih [Sentiasa] untuk memaparkan bar skrol.

Apakah saiz kertas a4? Apakah saiz kertas a4? Apr 25, 2024 am 11:55 AM

1. Nisbah bidang kertas A4 adalah berbeza daripada 2:3 atau 3:4 biasa. Nisbah uniknya iaitu √2:1 menjadikannya menonjol di antara banyak saiz kertas. 2. Nisbah khas ini memberikan kesan visual yang ideal dan praktikal untuk kertas A4.

Cara mengurangkan saiz foto 'Mesti lihat untuk pemula: Langkah terperinci untuk memampatkan saiz imej' Cara mengurangkan saiz foto 'Mesti lihat untuk pemula: Langkah terperinci untuk memampatkan saiz imej' Feb 06, 2024 pm 06:55 PM

Ramai rakan menggunakan kamera untuk merakam tabiat hidup mereka Sesetengah rakan fotografi profesional mungkin juga menggunakan kamera SLR untuk mengambil gambar yang lebih jelas. Walau bagaimanapun, walaupun gambar yang diambil oleh kamera SLR adalah jelas, untuk gambar berpuluh-puluh megabait, ia sudah pasti akan meningkatkan tekanan pada peranti storan. Jadi, adakah cara untuk mengurangkan saiz foto sambil mengekalkan butiran gambar sebanyak mungkin? Malah, hanya memampatkan imej. Jadi bagaimana untuk memampatkan saiz imej? Berikut adalah dua kaedah yang baik untuk dikongsi. Kaedah 1: Kami boleh mengimport imej dalam alat kecantikan tanpa sebarang pemprosesan dan penyuntingan lain. Apabila menyimpan gambar, sistem akan menyediakan pilihan pelarasan kualiti imej, dan kami boleh menyeret peluncur untuk melaraskan ketajaman yang dikekalkan. Apabila anggaran saiz memenuhi keperluan anda, klik Simpan. Kaedah 2: ① Mula-mula buka ini ".

Apakah saiz a5 Apakah saiz a5 Apr 24, 2024 pm 05:53 PM

1. Kertas A5 ialah saiz kertas standard antarabangsa, saiznya ialah 148 mm x 210 mm (5.83 inci x 8.27 inci). 2. Ia sering digunakan dalam pelbagai aplikasi seperti alat tulis, buku nota, risalah dan buku. 3. Saiz kertas A5 adalah lebih besar sedikit daripada separuh daripada kertas A4, dan ia adalah saiz kelima dalam siri A saiz kertas. 4. Siri saiz ini telah dibangunkan oleh jurutera Jerman Walter Portmann pada awal abad ke-20 untuk mencipta satu siri saiz kertas standard berdasarkan nisbah emas.

See all articles