.show() not working on page load

I have been trying to get the jQuery to animate the loading of my page. I have proved that jQuery is working correctly because it works with .hide();

Here is my JSFiddle

Here is my JavaScript File

$(document).ready(function(){
  $(".intro").show();
});

---

use

display: none;

instead of

visibility: hidden;

for the class .intro in your css.

Here is the working fiddle.

---

In your css, you are setting visibility: hidden; . Change it to display:none .

Because .show() is basically doing display:block .

OR

Change the code like this $(".intro").css("visibility","visible")

Fiddle

---

It is because you have this is your CSS:

.intro {
    visibility: hidden;
}

To fix this, change your CSS to:

.intro {
    display: none;
}

OR

Change the JS:

$(document).ready(function(){
    $(".intro").css('visibility', 'visible');
});

The jQuery .show() method sets the style of an element to display: block; but ignores the visibility style. The .hide() method essentially adds display: none; to an element.

Here is a good related question.

链接地址: http://www.djcxy.com/p/83566.html

上一篇: 如何旋转画布的特定部分

下一篇: .show（）不能在页面加载中工作