Question

我的滑块需要帮助。我想设置下拉列表（选择框）here。

（http://awesomescreenshot.com/0f94xotzc6）

我需要ie9，ie10，safari，chrome和firefox的样式。但我找不到任何解决方案:(

我最好的方式是this one，但是来自UI Slider的“after elements”存在问题。在前端，它看起来像：

<select id="betrag" class="test" name="betrag">
<div id="slider" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" style="margin-top:8px">

我不能像在示例

中那样将div设置为“styled-select”类

<div class="styled-select">
   <select>
      <option>Here is the first option</option>
      <option>The second option</option>
   </select>
</div>

每次看起来像这样，在前端

<div class="styled-select"" style="text-align:right">
<select id="betrag" class="test" name="betrag">
<div id="slider" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" style="margin-top:8px">
</div>

在FF中，Chrome看起来不错，但是IE有问题。

如何设置下拉列表的样式？

Answer 1

如果我理解正确，你希望滑块的DIV注入DOM 之后带有.styled-select的div。

假设您使用链接中的标准JQuery UI滑块代码，您可以从中修改它：

var slider = $( "<div id='slider'></div>" ).insertAfter( select ).slider({

到此：

var slider = $( "<div id='slider'></div>" ).insertAfter( $('div.styled-select') ).slider({

Jquery UI滑块和自定义样式

1 个答案: