Question

这是HTML，

<ul>
  <li>List One</li>
  <li>List Two</li>
  <li>List Thre</li>
  <li>List Four</li>
  .......................
</ul>

我可以动态设置左值并在每个项目上增加20％吗？例如 -

<ul>
  <li style="left:20%;">List One</li>
  <li style="left:40%;">List Two</li>
  <li style="left:60%;">List Thre</li>
  <li style="left:80%;">List Four</li>
  .......................
</ul>

感谢您的帮助。

Answer 1

使用each()回调中可用的索引来增加值：

＆＃13;

$( "li" ).each(function(i) {
    var percent = 20 * (i+1) +'%'; 
    $( this ).css( "left", "+=" + percent ); 
});

＆＃13;

li {position:absolute; top:0}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<ul>
  <li>List One</li>
  <li>List Two</li>
  <li>List Thre</li>
  <li>List Four</li>

</ul>

＆＃13;

如何使用jquery动态增加左侧位置？

1 个答案: