Bagaimana untuk Melaraskan Lebar Senarai Jatuh Turun dalam Internet Explorer untuk Memadankan Panjang Kandungan?

Patricia Arquette
Lepaskan: 2024-10-20 15:05:02
asal
972 orang telah melayarinya

How to Adjust Dropdown List Width in Internet Explorer to Match Content Length?

Menyesuaikan Lebar Senarai Jatuh Turun dalam Internet Explorer

Dalam Internet Explorer, senarai lungsur turun selalunya mempunyai lebar tetap yang sepadan dengan lebar peti jatuh yang mengandungi. Ini boleh membawa kepada hasil yang tidak sedap dipandang apabila kandungan dalam senarai juntai bawah berbeza-beza panjangnya. Untuk menangani isu ini, anda mungkin mempertimbangkan untuk menggunakan CSS untuk menetapkan lebar yang berbeza untuk kotak lungsur turun dan senarai lungsur.

Satu penyelesaian yang berpotensi melibatkan penggunaan gabungan JavaScript dan CSS. Pendekatan ini bergantung pada jQuery untuk mengesan interaksi pengguna dengan senarai juntai bawah. Apabila senarai difokuskan, dituding di atas atau diklik, JavaScript akan menambah kelas pada elemen untuk mengembangkan lebarnya. Apabila elemen hilang fokus atau tidak lagi dituding, kelas akan dialih keluar.

Untuk melaksanakan penyelesaian ini, anda boleh memasukkan kod JavaScript berikut ke dalam projek anda:

<code class="javascript">if (!$.support.leadingWhitespace) { // if IE6/7/8
    $('select.wide')
        .bind('focus mouseover', function() { $(this).addClass('expand').removeClass('clicked'); })
        .bind('click', function() { $(this).toggleClass('clicked'); })
        .bind('mouseout', function() { if (!$(this).hasClass('clicked')) { $(this).removeClass('expand'); }})
        .bind('blur', function() { $(this).removeClass('expand clicked'); });
}</code>
Salin selepas log masuk

Selain itu, anda boleh menggunakan CSS untuk menetapkan lebar yang diingini untuk kotak lungsur turun dan senarai lungsur turun:

<code class="css">select {
    width: 150px; /* Or whatever width you want. */
}
select.expand {
    width: auto;
}</code>
Salin selepas log masuk

Dengan memberikan kelas "lebar" kepada elemen lungsur yang terjejas, anda boleh mendayakan fungsi ini untuk kawasan tertentu aplikasi anda . Pendekatan ini memberikan pengalaman yang lebih mesra pengguna dan memastikan bahawa lebar senarai lungsur turun menyesuaikan diri dengan kandungan yang terkandung di dalamnya, menghapuskan keperluan untuk ruang putih yang berlebihan.

Atas ialah kandungan terperinci Bagaimana untuk Melaraskan Lebar Senarai Jatuh Turun dalam Internet Explorer untuk Memadankan Panjang Kandungan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber: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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan