如何将jqueryui滑块定位在图像下方？

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.0/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.0/themes/base/jquery-ui.css">

<div id="slider-container">
  <img src="your-image.jpg" alt="Your Image">
  <div id="slider"></div>
</div>

#slider-container {
  position: relative;
  display: inline-block;
}

#slider {
  position: absolute;
  bottom: 0;
  width: 100%;
}

$(function() {
  $("#slider").slider({
    // 设置滑块的相关参数
  });
});