Jquery, Взаимодействие с пользователем: Наведите указатель мыши для выделения комбинаций

Question

Дж.С. Фиддл (код)

Это более сложная задача, которую я поставил перед собой, изучая массивы, но теперь мне было интересно, может ли кто-нибудь из вас придумать лучший, более чистый способделать эту задачу.Я просто хочу список проектов, которые выделяются, когда пользователь наводит курсор на некоторые ссылки ..

Что я хочу сделать

У меня есть список проектов, на каждойпроект, который я мог бы работать над SEO, разработкой или дизайном.На странице также есть список ссылок: дизайн, разработка и SEO.При наведении на ссылку я хочу, чтобы некоторые проекты были выделены .. (комбинации).Поэтому некоторые проекты, над которыми я мог бы выполнить более одной задачи, будут выделены для более чем одной ссылки .....

Как я пытался это сделать

IЯ подумал, что смогу сделать 2d массив со списком включений для проектов.В зависимости от того, какая ссылка была над вами, вытащить правильный массив, если вы видите ссылку JSfiddle, это насколько я могу пойти.

Пример чего-то очень похожего

Дизайн ID

Спасибо за любую помощь или совет

Надеюсь, я объяснил это ясно, Я знаю, что мог порватькод выключен для примера ссылки, но я скорее учусь делать, а затем просто вырезать и вставлять .. - посмотрите, что другие думают и используют jquery.

Answer 1

Вы можете использовать 3 разных стиля для каждого проекта, скажем: ".design", ".seo", ".development"

$("#link1").hover(
  function ()
  {
    $(".design").each(function()
    {
        $(this).toggleClass("highlight");
    });
  },
  function ()
  {
    $(".design").each(function()
    {
        $(this).toggleClass("highlight");
    });
  }
);

Объяснение: Когда мышь наведена на link1 класс.подсветка переключается (добавляется при наведении курсора мыши, удаляется при наведении курсора мыши) на элементы, которые используют класс .design.Вы можете сделать аналогично другим 2 классам.