How to add display:inline-block in a jQuery show() function?
Instead of show
, try to use CSS to hide and show the content.
function switch_tabs(obj) {
$('.tab-content').css('display', 'none'); // you could still use `.hide()` here
$('.tabs a').removeClass("selected");
var id = obj.attr("rel");
$('#' + id).css('display', 'inline-block');
obj.addClass("selected");
}
Setting the CSS property after you have used .show()
should work. Maybe you are targeting the wrong element on your HTML page.
$('#foo').css('display', 'inline-block');
But if you are not using any effects of .show(), .hide()
why don't you set those CSS properties manually like:
$('#foo').css('display','none');
$('#foo').css('display','inline-block');
Use css() just after show() or fadeIn() like this:
$('div.className').fadeIn().css('display', 'inline-block');