jquery - 滑动切换两种不同的 CSS 状态

Question

当我需要它向下和向上滑动时，这效果很棒，但由于我的 CSS，当它向上滑动时，它会出现双边框。所以我尝试取出主 css 中的顶部边框并将其添加到幻灯片之后，但如果有人再次切换它仍然存在。我将如何做到这一点，以便在第一个位置(当其向上时)没有边框顶部，而当其在第二位置(当其向下时)有边框顶部。这是我的代码

$('.product').click(function() {
  $('.info').slideToggle('slow', function() {
    $('.product').css( "border-top","1px solid #000" );
  });
});

Answer 1

Demo jsBin

$('.product').toggle(function() {
    $('.info').stop(1).slideDown('slow');
    $(this).css( "border-top","1px solid #000" );
}, function(){
    $('.info').stop(1).slideUp('slow');
    $(this).css( "border-top","1px solid transparent" );
});

我使用.stop(1)来清除一些动画队列。