Показать сообщение отдельно
  #11 (permalink)  
Старый 31.07.2018, 15:27
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,299

kvizor34,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <style type="text/css">
  li{
      width: 100px;
      height: 20px;
      border: 1px dashed Gray;
      padding: 5px;
  }
  .red{
      background-color: Red;
  }

  </style>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
   <script>
      $(function() {
    $("ul").on("click", "li", addCls);
    function addCls()
    {
       var el = $(this), cls = ":not(." + this.className +")";
       el.nextUntil(cls).add(el.prevUntil(cls)).addClass("red")
    }


     })
   </script>
</head>

<body>
<ul>
    <li class="slonik"></li>
    <li class="begemotik"></li>
    <li class="begemotik"></li>
    <li class="begemotik"></li>
    <li class="slonik"></li>
    <li class="slonik"></li>
    <li class="slonik"></li>
    <li class="begemotik"></li>
    <li class="begemotik"></li>
</ul>

</body>

</html>
Ответить с цитированием