In my page I have a bunch (about 30) dom nodes that should be added invisible, and fade in when they are fully loaded.
The elements need a display: inline-block style.
I would like to use the jquery .fadeIn() function. This requires that the element initially has a display: none; rule to initially hide it. After the fadeIn() the elements off course have the default display: inherit;
How can I use the fade functionality with a display value other than inherit?
opposite of display block is. display : none; it used for deleting and recreating them. You can also consider inline-block : inline-block elements inline elements but they have a width and a height.
Also, with display: inline-block , the top and bottom margins/paddings are respected, but with display: inline they are not. Compared to display: block , the major difference is that display: inline-block does not add a line-break after the element, so the element can sit next to other elements.
A block element fills the entire line, and nothing can be displayed on its left or right side. The display property also allows the author to show or hide an element. It is similar to the visibility property.
$("div").fadeIn().css("display","inline-block");
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With