javascript - 单击 li 将其滚动到容器顶部

Question

我有一个UL固定的overflow:auto高度。在这UL我有一些LI.

我想创建一个功能，单击LI它会放置在UL.

<ul class=list>
 <li>A</li>
 <li>B</li>
 <li>C</li>
 <li>D</li>
 <li>E</li>
</ul>

例如，如果我点击 D 它应该移动到顶部。

https://codepen.io/andrew_88/pen/mYWdmg

标签： javascriptjquery

Answer 1

用于.prependTo将 移动li到顶部：

$('li').on('click', function() {
  $(this).prependTo($(this).closest("ul"));
  $('.list').animate({scrollTop: 0 }, 1000);
})

更新的 codepen：https ://codepen.io/anon/pen/LoWYMq?editors=1111