有没有办法让选择内容下推？

Question

我是新手！我正在使用 jquery 插件（ddslick）来使用图像和描述自定义选择元素，但我有一些问题。我想了解是否有一种方法可以在我点击内容时将其下推。https://i.stack.imgur.com/ebVoD.png<div class="row">            <div class="col-md-3">                <div class="select-box pt-3 col-md-6">                    <select id="myDropdown">                        <option value="0" data-imagesrc="1small.png"> Facebook</option>                        <option value="1" data-imagesrc="1small.png">Twitter</option>                        <option value="2" selected="selected" data-imagesrc="1small.png">LinkedIn</option>                        <option value="3" data-imagesrc="1small.png">Foursquare</option>                        <option value="4" data-imagesrc="1small.png">Twitter</option>                        <option value="5" data-imagesrc="1small.png">LinkedIn</option>                        <option value="6" data-imagesrc="1small.png">Foursquare</option>                        <option value="7" data-imagesrc="1small.png">Twitter</option>                        <option value="8"  data-imagesrc="1small.png">LinkedIn</option>                        <option value="9" data-imagesrc="1small.png">Foursquare</option>                        <option value="10" data-imagesrc="1small.png">Foursquare</option>                    </select>                </div>            </div>        </div>

Answer 1

你可以只添加这个CSS：

#myDropdown .dd-options { position: relative; }

演示

$('#myDropdown').ddslick({});

#myDropdown .dd-options { position: relative; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/ddslick@1.0.3/dist/jquery.ddslick.min.js"></script>

<div class="row">

  <div class="col-md-3">

    <div class="select-box pt-3 col-md-6">

      <select id="myDropdown">

        <option value="0" data-imagesrc="1small.png"> Facebook</option>

        <option value="1" data-imagesrc="1small.png">Twitter</option>

      </select>

    </div>

  </div>

</div>

<p>Some content</p>