Borsok
@Borsok
Начинающий верстальщик

Вопрос по уменьшению кода JQ?

Всем привет, подскажите пожалуйста, как совместить и сократить эти коды JQ.

$('.animals').on('mouseover', function () {
        var aid = this.id;
        if (aid == 'hov-1') {
            $('.television, .read, .booking, .children, .shot, .explorer, .store, .thing, .support').css('color', '#fff');
            $('.bg_animals').css('opacity', '1');
        }
});

$('.animals').on('mouseout', function () {
        var aid = this.id;
        if (aid == 'hov-1') {
            $('.bg_animals').css('opacity', '0');
        }
});
  • Вопрос задан
  • 72 просмотра
Пригласить эксперта
Ответы на вопрос 1
DeLaVega
@DeLaVega
Верстаю, фронтэндю =)
const itemId = 'hov-1';
$('.animals').hover(() => {
    if (this.id === itemId) {
        $('.television, .read, .booking, .children, .shot, .explorer, .store, .thing, .support').css('color', '#fff');
        $('.bg_animals').css('opacity', '1');
    }
}, () => {
    if (this.id === itemId) {
        $('.bg_animals').css('opacity', '0');
    }
});


Но лучше показать вёрстку, тогда я смогу сказать наверняка. Это НУЖНО переделать на переключение простым классом.

$('.animals').hover(() => {
    if (this.id === 'hov-1') {
        $('.television, .read, .booking, .children, .shot, .explorer, .store, .thing, .support').addClass('active');
        $('.bg_animals').addClass('active');
    }
}, () => {
    if (this.id === 'hov-1') {
        $('.bg_animals').removeClass('active');
    }
});

.bg_animals {
    opacity: 0;

    &.active {
        opacity: 1;
    }
}
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы