Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

alternative to fadeToggle() in JQuery

I have a div that I want to show/hide when clicking a button. The arrangement of the div's is

<div id="someStats">
</div>
<div id="mainContent">
</div>
<div id="someOtherStats">
</div>

, meaning that from the mainContent I control whether to show or hide the two info div's left and right. That gives me following problem: not only fadeToggle() makes one of the div's transparent, its display attribute is set to none, which causes a displacement of the mainContent when fading out someStats. Are there alternatives to fadeToggle() without specifing two functions (or splitting a function like

if(div.isShown()){
   hide() 
}else{ 
   show()
}

? Or can I manipulate fadeToggle() in some way?

like image 538
Valentino Ru Avatar asked Dec 12 '25 10:12

Valentino Ru


1 Answers

You can just animate the opacity

var target = $('#someStats'),
    opacity = target.css('opacity');

target.animate({opacity: (opacity==1?0:1)});

Demo at http://jsfiddle.net/gaby/MNhcU/

like image 150
Gabriele Petrioli Avatar answered Dec 15 '25 03:12

Gabriele Petrioli



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!