jquery pokaż/ukryj przy użyciu inline-block

Question

Mam niektóre HTML i CSS, który wygląda tak:

<div id="TheContainer"> 
<div class="MyDivs"></div> 
<div class="MyDivs" id="ThisDiv"></div> 
</div> 

#TheContainer{text-align:center;} 
.MyDivs{margin:0px auto;display:inline-block;} 
#ThisDiv{display:none;} 

Używam inline-block i margin: 0px auto tak, że MyDivs są skupione w obrębie TheContainer. Problem polega na tym, że kiedy to zrobić:

$('#TheContainer').children().hide(); 
$('#ThisDiv').show(); 

następnie ThisDiv nie skupia się już ponieważ wyświetlacz zmieniło od zera do blokowania zamiast inline-block jak mam go w definicji CSS.

wiem Mógłbym napisać .css('display','none') i .css('display','inline-block') ale zastanawiałem się, czy istnieje sposób, aby to robić poprzez utrzymywanie .show()

Dzięki za sugestie.

Answer 1

Można zrobić rozszerzenie do jQuery ...

$.fn.showInlineBlock = function() { 
    return this.css('display', 'inline-block'); 
}; 

useage byłoby:

$('#whatever').showInlineBlock(); 

jsFiddle Demo