Как я могу сделать изображение более светлым и заменить его другим? - PullRequest
Новая
       108

Как я могу сделать изображение более светлым и заменить его другим?

0 голосов
/ 30 мая 2020

У меня проблемы с галереей изображений. По какой-то причине изображение тускнеет, но остальной код не выполняется, он просто останавливается на полпути. Я попытался удалить функцию постепенного исчезновения, и код работает нормально, изображения меняются местами, как они должны быть et c. Что с затуханием я делаю неправильно? 

 $('.frame').click(function() {
    $("#lightbox").toggleClass("fadeout", function (){
    var copy = $(this).children().clone();
    $('#lightbox').children().replaceWith(copy);
    $("#lightbox").toggleClass("fadeout");
    });
});

Я полный новичок-самоучка ie, поэтому могу задать несколько глупых вопросов. 

    #lightbox {
    opacity: 1;
    padding: 0 0 0 1%;
    width: 89%;
    height: 100%;
    float: right;
    text-align: center;
    transition: opacity 1s ease;
}

#lightbox.fadeout {
    opacity: 0;
}

.frame {
    width: 100%;
    text-align: left;
}

<div id="gallery_container">
<div id="lightbox">
    <img src="images/IMG_6412.jpg" alt="">
    </div>
<div id="gallery_nav">
    <ul>
        <div class="frame"><img src="images/XA2.jpg" alt=""></div>
        <div class="frame"><img src="images/Mega002.jpg" alt=""></div>
        <div class="frame"><img src="images/IMG_6412.jpg" alt=""</div>
    </ul>
</div>
    </div>

1 Ответ

0 голосов
/ 30 мая 2020

Вы неправильно используете функцию toggleClass. Второй параметр - это функция, но согласно документации второй параметр должен быть state указанием, которое является логическим значением (True = show, False = hide)

На основе ваших комментариев, вот что-то что должно работать: 

$('.frame').click(function() {
    var copy = $(this).children().clone();
    $("#lightbox").fadeOut(2000, function (){
      $('#lightbox').children().replaceWith(copy);
      $("#lightbox").fadeIn(2000);
    });
});
...