Как вернуть назад аттрибут класса

297
09 марта 2017, 23:06
var isEven = function(someNumber) {
  return someNumber % 2 === 0;
};
if (!isEven(count)) {
    $(this).toggleClass('my3d');
    $(".main-menu a").removeAttr("class");
    $(".main-cube").animate({top: "0%"}, 1000);
    $(".cube").css({width: "95vw", height: "45vh", transform: "rotate3d(0,1,0,0deg)", left: "0"});
    $(".side").addClass("landing-loft").css({width: "80vw", height: "100vh"});
  }
  // on even clicks do this
  else if (isEven(count) === true) {
    $(".main-menu a").attr("class");
    $(".main-cube").css("top", "10%");
    $(".cube").css({width: "600px", height: "600px"});
    $(".side").removeClass("landing-loft").css({width: "600px", height: "600px"});
  }
});

Верхняя часть рабочая, нижняя в принципе тоже, но при помощи $(".main-menu a").attr("class"); не могу назад вернуть аттрибут класса, чтобы кубик вращался. Как мне его вернуть?

Answer 1

На нечетный клик сохраним значения аттрибутов class в data для каждого элемента из $(".main-menu a"), а на четный клик - восстановим.

var isEven = function(someNumber) {
    return someNumber % 2 === 0;
};
if (!isEven(count)) {
    $(this).toggleClass('my3d');
    $(".main-menu a").each(function() {
      $(this).data("storedclass", $(this).attr("class"));
      $(this).removeAttr("class");
    });
    $(".main-cube").animate({top: "0%"}, 1000);
    $(".cube").css({width: "95vw", height: "45vh", transform: "rotate3d(0,1,0,0deg)", left: "0"});
    $(".side").addClass("landing-loft").css({width: "80vw", height: "100vh"});
 } else { // on even clicks do this
    $(".main-menu a").each(function() {
      $(this).attr("class", $(this).data("storedclass"));
    });
    $(".main-cube").css("top", "10%");
    $(".cube").css({width: "600px", height: "600px"});
    $(".side").removeClass("landing-loft").css({width: "600px", height: "600px"});
 }
});
READ ALSO
Как поставить в очередь?

Как поставить в очередь?

Описание работы слайдера: слайдер меняет по 5 фотографий при клике, и записывает 5 фотографий в буфер, чтобы при следующем клике заменяет предыдущие...

239
Что такое Critical rendering path? [требует правки]

Что такое Critical rendering path? [требует правки]

Объясните, пожалуйста, значение термина Critical rendering path

263
flexbox баги, поддержка браузеров и устройств

flexbox баги, поддержка браузеров и устройств

Привет всем! Я недавно столкнулся с проблемой flexbox на iosКак я понял в итоге не работают некоторые свойства в некорых ситуациях, словом есть...

314