通过WP中的包装器获取页面内容以滑入 [英] Getting page content via wrapper in WP to slide in

问题描述

我试图有我的Wordpress内容，当访问首页，导航到其他页面 - 内容从页面加载时jQuery顶部细微地下滑。目前我有一些代码实现，我认为应该工作，但不是。忽略转换，只有定义的包装器中的文本内容才会执行任何操作，它所做的只是落后25px左右，然后返回，几乎就像大页面有时在慢速连接时加载一样。但这不是我的页面的问题。

I'm trying to have my Wordpress content, when visiting the homepage, navigating to the other pages - have the content slide down from the top subtly with jQuery on page load. Currently I have some code implemented which I think should work, but isn't. The transitions are ignored and only the text content within the defined wrapper does anything, and it what it does is just lag down 25px or so, and go back up, almost as how large page's sometimes load at slow connections. But this is not the issue with my page.

这是我有的。

c $ c>< / head> in header.php

Right before closing </head> in header.php

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
<script>

$(document).ready(function(){
    $("#wrapper").addClass("visible");
});

</script>

我用 #wrapper ，以及所有的样式。

What I've done with the #wrapper, and all of it's styles.

#wrapper { 
    padding: 15px;
        background: #fff;
        -moz-box-shadow: inset 0 0 5px 5px #888;
        -webkit-box-shadow: inset 0 0 5px 5px#888;
        box-shadow: inset 0 0 5px 5px #888;
        border-radius: 5px; 
       -moz-border-radius: 5px; 
       -webkit-border-radius: 5px; 
        border: 1px solid #807A7C;
}

#wrapper {

    top: -20px;
    width: 540px;
    transition: top 0.5s;
    -moz-transition: top 0.5s;
    -webkit-transition: top 0.5s;
    -o-transition: top 0.5s;
}

#wrapper.visible {
    top: 0px;
}

我缺少什么？

推荐答案

这可能与你隐藏内容的方式有关。你可能更好的只是使用jQuery显示内容与动画通过摆脱顶和过渡，而不是

It might have to do with the way you're hiding the content. You might be better off just using jQuery to show the content with animation by getting rid of the "top" and transitions and instead doing

$(document).ready(function(){
    $("#wrapper").show("slow",function(){});
});

这篇关于通过WP中的包装器获取页面内容以滑入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！