Poziomy pasek przewijania nie działa przy tagu select

Próbuję ustawić poziome paski przewijania na tagu select, który nie działa.Poziomy pasek przewijania nie działa przy tagu select

Oto kod:

<select style="height: 250px; width: 300px; overflow: auto;" 
    id="dnn_ctr459_ManageRelatedProducts_lstFrom" multiple="multiple" 
    name="dnn$ctr459$ManageRelatedProducts$lstFrom" class="selectList" size="4"> 
    <option value="9">33 Uithoeke</option> 
    <option value="10">Aantekeninge by Koos Prinsloo</option> 
    <option value="11">Aantekeninge by Koos Prinsloo (enhanced e-book)</option> 
    <option value="12">Access to Social Security</option> 
    <option value="13">Angling for Interpretation</option> 
    </select> 

.selectList 
{ 
    height: 250px; 
    overflow: auto; 
    width: 300px; 
}

enter image description here

wyniki Matta rozwiązaniem w tym: wynik enter image description here

Finał w FF enter image description here

wynik końcowy w IE, dzięki Matt! enter image description here

Źródło

2011-08-24 SixfootJames

overflow-x: scroll; zamiast tylko przepełnienia: przewiń; także być może overflow-y: hidden; –

Czy możesz wyświetlić kod HTML dla wyniku końcowego? ta – Rippo

Nie jestem pewien, czy potrafisz to zrobić, ale zawsze możesz go oszukać w taki sposób, umieszczając element div wokół zaznaczenia i ustawiając jego szerokość i poziome przewinięcie. Taken from here.

Źródło

2011-08-24 14:19:15

To dziękowało Mattowi, ale wymusza podwójne paski przewijania w IE7. Myślę, że ponieważ Scroll-x i scroll-y nie działają w IE? – SixfootJames

powinien działać, czy wdrażasz go poprawnie? [spójrz na tę stronę testową przepełnienia css] (http://www.brunildo.org/test/Overflowxy2.html). –

Fajnie, dzięki Matt. Wydaje się, że w IE trzeba ręcznie wyłączyć pionowy pasek przewijania, który działał! – SixfootJames

Nie można wymusić przewijania pasków na wybranych elementach.

Źródło

2011-08-24 14:18:32 Chris

Dzięki Chris. Problem polega na tym, że używany przez nas koszyk używa tego elementu select z bardzo długimi nazwami produktów i potrzebuję przewinięcia tego elementu. Sugestia Matta K działała, ale wtedy oznaczałoby to dwa paski przewijania (pionowe) i bardzo utrudniałaby nawigację. Czy istnieje sposób na zmianę zawijania słów na wybranych elementach? – SixfootJames

nie ma dwóch pasków przewijania, jeśli używasz atrybutu overflow-x ... –

Dzięki Matt ... wydaje się, że zadziałało. Testuję to teraz w IE 7 i mam nadzieję, że to też działa. – SixfootJames

-1

Tak, możesz. Wypróbuj za pomocą JQuery:

<div id='test' style="overflow-x:scroll; width:120px; overflow: -moz-scrollbars-horizontal;"> 
<select id='mySelect' name="mySelect" size="5"> 
    <option value="1">one two three four five six</option> 
    <option value="2">seven eight</option> 
    <option value="3">nine ten</option> 
    <option value="1">one two three four five six</option> 
    <option value="2">seven eight</option> 
    <option value="3">nine ten</option> 
    <option value="1">one two three four five six</option> 
    <option value="2">seven eight</option> 
    <option value="3">nine ten</option> 
    <option value="1">one two three four five six</option> 
    <option value="2">seven eight</option> 
    <option value="3">nine ten</option> 
</select> 
<div id="divv" style='font-size: 1px'>&nbsp</div> 
</div> 

<script> 
    $('#divv').css('width', $('#mySelect').outerWidth()); 
    $('#mySelect').css('width', $('#test').outerWidth()); 
    $("#test").scroll(function() { 
     $('#mySelect').css('width', $(this).outerWidth() + $(this).scrollLeft()); 
    }); 
</script>

Źródło

2014-03-29 16:59:40 Cyrus

Poziomy pasek przewijania nie działa przy tagu select

Odpowiedz

Powiązane problemy