在网页加载时停用透明div希望在网页加载后显示 [英] Disable transparent div at the time of page loading & want to show after page load

问题描述

我做了一个透明的div，在这个div上有一些文本，以使它更明亮。但是问题是在第一次加载页面，这个div首先加载，这不是看起来不错，所以我只是希望这个div应该加载后，当所有其他内容的页面已加载。

I have made a transparent div which has some text over this div to show to make it more bright. But the problem is at the first time of loading the page this div is loading first , which is not looking good,So I just want that this div should load later at when all other content of page has loaded .

我在css中的div代码

My div code in css

#abc {
    position:absolute;
    top:228px;
    width:852px;
    height:160px;
    background-color:rgba(0,0,0,.3);
    border-radius:8px;
    }

我在我的视图中使用它， >

And I am using it in my view I am using it as

<div id="abc">
    <h1><?php echo Configure::read('SearchBarHeading');?></h1>
    <h2><?php echo Configure::read('SearchBarSubheading');?></h2>
</div>

那么如何先隐藏它呢？

So how can I make it hidden first & show it later when page has loaded

推荐答案

使用CSS隐藏它，然后使用jQuery显示它

Hide it with CSS and then display it using jQuery

CSS

#abc {
    position:absolute;
    top:228px;
    width:852px;
    height:160px;
    background-color:rgba(0,0,0,.3);
    border-radius:8px;
    display: none;
    }

jQuery JS

jQuery JS

$(document).ready(function() {
    $('#abc').show();  // or you can use .fadeIn()
});

这篇关于在网页加载时停用透明div希望在网页加载后显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！