.removeClass() работает только один раз

Я выложил несколько изображений в HTML 4x2. Мой скрипт в настоящее время увеличивает каждое изображение с помощью .addClass(), но будет только .removeClass() на первом изображении в галерее..removeClass() работает только один раз

Как бы это сделать, так как .removeClass() может применяться к каждому изображению? - Вот мой код:

$(document).ready(function() { 
    $('#fig').delegate('img', 'click', function() { 
     $(this).addClass("imgbig"); 
     $('.xbutton').stop(true, true).fadeTo(800, 1); 
     $("#fig").stop(true, true).addClass("f1"); 
    }); 

    $('.xbutton').click(function() { 
     $('#imgSmall').removeClass("imgbig"); 
     $('.xbutton').stop(true, true).fadeOut(800, 0); 
     $("#fig").stop(true, true).removeClass("f1"); 
    }); 
});

источник

2015-08-13 Filthy_Rich

'$ ('# imgSmall'). RemoveClass (" imgbig ");' Вы используете селектор id, который предназначен для выбора только одного узла, возможно, он должен быть $ (this) .removeClass (...) , –

Да, я попробовал это, однако «это» относится к xbutton, который не является изображением. Christos опубликовал решение ниже. Приветствия за предложение, хотя человек. –

Здесь $('#imgSmall').removeClass("imgbig") Вы выбираете изображение с идентификатором imgSmall, не все изображения, которые вы имеете.

Я полагаю, что вы должны переписать вы обратного вызова, как показано ниже:

$('.xbutton').click(function(){ 
    $(".imgbig").removeClass("imgbig"); 
    $('.xbutton').stop(true, true).fadeOut(800, 0); 
    $("#fig").stop(true, true).removeClass("f1"); 
});

источник

2015-08-13 18:51:14 Christos

Да, это сработало, приветствие. Теперь я чувствую себя пончиком> _ < –

@Filthy_Rich приветствую чувака. Я рад, что я спрятался :) – Christos

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

$(function() { 
    $('#fig').on('click','img', function(){ 
    $(this).addClass("imgbig"); 
    $('.xbutton').stop(true, true).fadeTo(800,1); 
    $("#fig").stop(true, true).addClass("f1"); 
    }); 

    $('#fig').on('click', '.xbutton', function(){ 
    // this line may be wrong depending on where your button is in relation to the image 
    $(this).stop(true, true).fadeOut(800, 0).find('.imgSmall').removeClass('imgbig'); 
    $('#fig').stop(true, true).removeClass("f1"); 
    }); 
});

Примечание: Я изменил imgSmall к классу, как я предполагаю, что все маленькие изображения имеют один и тот же класс, идентификаторы всегда должны быть уникальными.

источник

2015-08-13 19:01:34

.removeClass() работает только один раз

ответ

Смежные вопросы