Изменение простой функции jquery для изменения непрозрачности изображения - PullRequest
Новая
       6

Изменение простой функции jquery для изменения непрозрачности изображения

1 голос
/ 27 ноября 2011 
function toggle() {
  if ($(this).is(".open")) {
    $(this).animate({
      width: 400
    }, 500);
  } else {
    $(this).animate({
      width: $(this).data("width")
    }, 500);
  }
  $(this).toggleClass("open");
}
$("#portfolio_img1").click(function() {
  if (!$(this).data("width")) {
    var img = new Image();
    var _this = $(this);
    img.onload = function() {
      _this.data("width", this.width);
      toggle.call(_this);
    }
    img.src = $(this).css("backgroundImage").replace("url(\"", "").replace("\")", "");
  } else {
toggle.call(this);
  }
});

Функция toggle создает класс ".open", который изменяет ширину изображения с обрезанной ширины на полную ширину.В моем CSS я указываю, что непрозрачность изображений равна 0,5, а при наведении мыши на непрозрачность равна 1.Я также хочу, чтобы непрозрачность изменилась на 1 для изображений с классом "open", но когда я делаю .open { opacity: 1 } в CSS, это не оказывает никакого влияния.Как я могу изменить свою функцию так, чтобы при применении класса "open" непрозрачность изображения изменялась на 1, а при удалении класса "open" она возвращалась к 0.5?Спасибо

1 Ответ

0 голосов
/ 27 ноября 2011

Как-то так может помочь: 

//change from hover to check for class open in your case
$(this).hover(
      function() {
          $(this).stop().animate({ opacity: 1.0 }, 800);
      },
      function() {
          $(this).stop().animate({ opacity: 0.5 }, 800);
      })
});

надеюсь, это поможет

...