Hide Body until Content is Loaded — Works on IE, but not Safari?

StackOverflow https://stackoverflow.com/questions/7777576

سؤال

Here's a weird one -- something that works great in IE, but not in Safari. Here's my code:

<script type="text/javascript">
 $(document).ready(function(){
 $('body').css('display', 'block');
 });</script>

</head>
<body style="margin:0; display:none;">

The goal is to set the body display to none until the document is ready. Then change the display property to block.

Any idea what I'm doing wrong here?

هل كانت مفيدة؟

المحلول

You should use jQuery's .load() if you want the page to really be ready (images loaded too) before displaying it. On the other hand, you shouldn't hide the body at all with css, as people with javascript turned off will assume the site just crashed. Unless of course you're creating a 100% javascript dependent application.

نصائح أخرى

CAN I ADD some sort of conditional code, such that if javascript is not enabled it loads immediately, but if it is enabled it waits to display until the document is ready?

Yes, you can:

<script type="text/javascript">
 $(function(){
   $('body').css('display', 'block');
 });
</script>
</head>
<body>
<script type="text/javascript">
  $('body').css('display','none'); // this will execute before $(document).ready()
</script>
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top