от
У меня есть стол с полосатым стилем:
<div class="container" ng

В настоящее время я хочу достичь двух вещей:


Измените полосатый стиль в соответствии с составными рядами.


Теперь это так:


Но я хочу сделать это так:


2. То же самое я хочу сделать с зависанием. Есть ли способ парить весь ряд так:


Вот скрипка
    

        

Пожалуйста, войдите или зарегистрируйтесь для публикации ответа на этот вопрос.

1 Ответ

0 голосов
от
Я сделал некоторые изменения в вашем коде. Может быть, это поможет вам решить вашу проблему. Скрипка: скрипка
angular.module('sortApp', [])

  .controller('mainController', function($scope) {
    $scope.bntyList = [{
        month: "January",
        ih_project: "FRS BGD COL",
        ih_output: "12.00",
        ih_sum_output: "65.00",
        catRowMatch: false,
        rows: 3
      },
      {
        month: "January",
        ih_project: "FRS BGD LYT",
        ih_output: "34.30",
        ih_sum_output: "65.00",
        catRowMatch: true,
        rows: 2
      },
      {
        month: "January",
        ih_project: "HRD BGD COL",
        ih_output: "67.60",
        ih_sum_output: "65.00",
        catRowMatch: true,
        rows: 1
      },
      {
        month: "February",
        ih_project: "ENC2 BGD COL",
        ih_output: "77.00",
        ih_sum_output: "80.00",
        catRowMatch: false,
        rows: 2
      },
      {
        month: "February",
        ih_project: "ENC2 BGD LYT",
        ih_output: "90.00",
        ih_sum_output: "80.00",
        catRowMatch: true,
        rows: 1
      }
    ];
  });

angular.module('sortApp').directive("hoverClass", function() {
  return {
    restrict: 'A',
    scope: {
      hoverClass: '@'
    },
    link: function(scope, element) {
      element.on('mouseenter', function() {
        $el = $(this);
        console.log($el);
        $el.parent().addClass("hover");
        /* if ($el.parent().has('td[rowspan]').length == 0)
          $el.parent().prevAll('tr:has(td[rowspan]):first').find('td[rowspan]').addClass("hover"); */
      });
      element.on('mouseleave', function() {
$el.parent().removeClass("hover").prevAll('tr:has(td[rowspan]):first').find('td[rowspan]').removeClass("hover");
      });
    }
  };
});
body {
  padding
Добро пожаловать на сайт ByNets, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...