加载时自动滚动到水平布局左侧的div

Question

我是jquery的新手

我有一个地铁站（水平布局）

<pre>

<section id="content" >

            <section class="clearfix section" id="sharing-experience" style="margin-top: 100px; height: 525px;">

                <h3 class="block-title">first</h3>

                <div class="tile turquoise w3 h2 icon-fadeoutscaleup">
                    <a class="link" href="#">
                        <i class="fa-bookmark"></i>
                        <p class="title-right">one</p>
                        <p class="title">1</p>
                    </a>
                </div>
                <div class="tile brown w3 h2 icon-fadeoutscaleup">
                    <a class="link" href="#">
                        <i class="fa-clipboard"></i>
                        <p class="title-right">two</p>
                        <p class="title">2</p>
                    </a>
                </div>
            </section>
<section class="clearfix section" id="sharing-experience" style="margin-top: 100px; height: 525px;">

                <h3 class="block-title">second</h3>

                <div class="tile turquoise w3 h2 icon-fadeoutscaleup">
                    <a class="link" href="#">
                        <i class="fa-bookmark"></i>
                        <p class="title-right">one</p>
                        <p class="title">1</p>
                    </a>
                </div>
                <div class="tile brown w3 h2 icon-fadeoutscaleup">
                    <a class="link" href="#">
                        <i class="fa-clipboard"></i>
                        <p class="title-right">two</p>
                        <p class="title">2</p>
                    </a>
                </div>
            </section>
<section class="clearfix section" id="sharing-experience" style="margin-top: 100px; height: 525px;">

                <h3 class="block-title">third</h3>

                <div class="tile turquoise w3 h2 icon-fadeoutscaleup">
                    <a class="link" href="#">
                        <i class="fa-bookmark"></i>
                        <p class="title-right">one</p>
                        <p class="title">1</p>
                    </a>
                </div>
                <div class="tile brown w3 h2 icon-fadeoutscaleup">
                    <a class="link" href="#">
                        <i class="fa-clipboard"></i>
                        <p class="title-right">two</p>
                        <p class="title">2</p>
                    </a>
                </div>
            </section>


</section>

</pre>

准备就绪的页面应从第三部分开始，以便页面加载或准备就绪时从右至左应有一个动画

这是任何人都可以帮助的例子！！ 真的很棒，这是我正在使用megametro的地铁设计的链接

这是它的链接http://themes.grozav.com/metromega/

Answer 1

嗨，我想您想在页面加载时在页面中央放置第3部分，而在页面的左侧保留其他两个部分。

如果这是您想要的，则可以执行以下操作来实现您想要的。

$(document).ready(function(){
window.scrollTo($("#id-of-section-you-want-to-show").offset().left ,$("body").offset().left);

//应用动画}）;

是的，请务必更改您所在部分的ID。 由于在html页面中定义了特定的dom元素，因此id属性应该是唯一的。