2013-12-09 35 views
-2

我想提出一个麦粒肿切换这里http://jsfiddle.net/thiswolf/n3weg/1/,可以在这里看到http://jsfiddle.net/thiswolf/n3weg/1/show,由于某种原因,我不能把它隐藏隐藏和显示一个固定的股利

这是我使用

jQuery代码
$(document).ready(function(){ 
$('#styleswitch').addClass('closed'); 
$('.fixedpoint').css({ 
    'background-color':'red', 
    'position': 'fixed', 
    'width': '30px', 
    'height': '30px', 
    'left': '97%', 
    'top': '20%' 
}); 
$('.fixedcol').css({ 
    'background-color':'pink', 
    'position': 'fixed', 
    'width': '200px', 
    'height': '100px', 
    'left': '100%', 
    'top': '20%' 
}); 
$('.fixedpoint').on('click',function(){ 
if($('.fixedpoint').hasClass('closed')){ 
$('#styleswitch').addClass('open'); 
$(".fixedcol").css({'padding-right':'1px','height':'300px'}).animate({left:'77.12%'},350); 
}else if($('.fixedpoint').hasClass('open')){ 
$('#styleswitch').removeClass('open'); 
$('#styleswitch').addClass('closed'); 
$('.fixedcol').css({ 
    'background-color':'pink', 
    'position': 'fixed', 
    'width': '200px', 
    'height': '100px', 
    'left': '100%', 
    'top': '20%' 
}); 
} 
}); 
}); 

为什么不能隐藏我使用的代码?

+1

你永远不删除'closed'类,这样的条件,我不使用'closed'和'open'作为具有风格的CSS类总能得到满足 – adeneo

+0

在他们之中。他们只是标记。 –

回答

2

尝试:

$('.fixedpoint').on('click', function() { 
    if ($('#styleswitch').hasClass('closed')) { 
     $(".fixedcol").css({ 
      'padding-right': '1px', 
      'height': '300px' 
     }).animate({ 
      left: '77.12%' 
     }, 350); 
    } else if ($('#styleswitch').hasClass('open')) {     
     $('.fixedcol').css({ 
      'background-color': 'pink', 
       'position': 'fixed', 
       'width': '200px', 
       'height': '100px', 
       'left': '100%', 
       'top': '20%' 
     }); 
    } 
    $('#styleswitch').toggleClass('open closed'); 
}); 

Updated fiddle here.