0

使用这个 jquery，我可以在页面加载后淡入：

<script type="text/javascript">
$(function() {
    $('body').hide().fadeIn(1000);
});
</script>

现在我想做的是在单击按钮后实现该功能。例如，当用户进入页面时，会有一个带有可点击按钮的窗口。单击按钮后，它会在 jquery 中淡入淡入加载页面。我认为这将是某种形式，但问题是它需要在页面加载时隐藏正文，并且然后在单击按钮后淡入正文。

编辑：我有这样的东西，但它不会正确加载。

<script type="text/javascript">
$(function (){
    $('bodycontent').hide();
});

function loadp(){
    $(function(){
    $('body').hide();
    $('bodycontent').fadeIn(1000);
     });
}   
</script>

对于身体和身体内容

<body>
<button onclick="loadp()">Try it</button>
</body>
<bodycontent>
codehere
</bodycontent>

从理论上讲，这应该在单击按钮后隐藏正文并淡入正文内容。但是身体是隐藏的，但身体内容没有加载。

4

2 回答 2

1

演示

<button id="fadeContent">OK, fade!</button>

<div id="bodyContent">    
    <h1>Page</h1>
    <p>Content</p>      
</div>


#bodyContent{
  display:none;
  position:absolute;
  top:0;      left;0;
  width:100%; height:100%;
  background:#cf5;
}


$(function() {

  $('#fadeContent').click(function(){
    $(this).hide();
    $('#bodyContent').fadeIn(1000);
  });

});
于 2013-09-29T20:31:05.647 回答
0

这是我是如何做到的：http: //jsfiddle.net/VTD9k/ 关键是您将内容放在主体内的 div 中：#main-wraper，并将按钮放在另一个 div 中

于 2013-09-29T20:33:35.613 回答