如何相应地稳定元素的顶部位置

Question

我试图稳定div右侧线条的垂直位置。我该怎么办呢？

这里是

<section id="endustriyel" class="industrial-wrapper">
        <div class="polygon">
                <div class="sol">
                        <div class="background"></div>
                </div>
                <div class="sag">
                        <div class="background">
                                <div class="lines">
                                        <div class="dot">
                                                <img src="img/dot.png" alt="" />
                                        </div><!--/ .dot -->
                                        <div class="line-1">
                                                <img src="img/mimari-line-1.png" alt="" />
                                        </div><!--/ .line-1 -->
                                        <div class="line-2">
                                                <img src="img/mimari-line-2.png" alt="" />
                                        </div><!--/ .line-2 -->
                                </div><!--/ .lines -->
                        </div><!--/ .background -->
                        <article>
                                <h2>3B Modelleme</h2>
                                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac magna leo. Aenean nec semper quam. Duis mattis feugiat felis sed consequat. <a id="threed" href="3boyut.html">Devamı</a></p>
                        </article>
                </div><!--/ .sag -->
        </div><!--/ .polygon -->
        <div id="svg-line2" class="svg-line">
                <div id="trigger2" class="spacer s0"></div>
        </div>
</section>

我根据窗户高度用jquery重新排列剖面高度。

这是我使用的css代码;

section#endustriyel .polygon .sol {
    position: absolute;
    height: 100%;
    width: 50%;
    left: 0;
    float: left;
    overflow: hidden;
    z-index: 2;
}

section#endustriyel .polygon .sol .background {
    position: relative;
    background: url(../img/mimari-sol.jpg) no-repeat right center;
    background-size: contain;
    width: 100%;
    height: 100%;
    margin-left: 500px;
}

section#endustriyel .polygon .sag {
    position: absolute;
    height: 100%;
    width: 50%;
    right: 10px;
    float: right;
    overflow: hidden;
    padding-left: 10px;
}

section#endustriyel .polygon .sag .background {
    position: relative;
    background: url(../img/mimari-sag.jpg) no-repeat left top;
    background-size: initial;
    width: 100%;
    height: 100%;
    margin-left: -500px;
    overflow: hidden;
}
section#endustriyel .polygon .sag .background .lines .dot {
    margin-top: 250px;
    margin-left: -8px;
    z-index: 3; 
}

section#endustriyel .polygon .sag .background .lines .line-1 {
    margin-top: 250px;
    margin-left: -400px;
    z-index: 3;
}

section#endustriyel .polygon .sag .background .lines .line-1 img {
    /* margin-top: -30px; */
}

section#endustriyel .polygon .sag article {
    position: absolute;
    z-index: 6;
    top: 0;
    width: 385px;
    overflow: hidden;
}

section#endustriyel .polygon .sag article h2 {
    margin-left: 700px;
    margin-top: 175px;
}

section#endustriyel .polygon .sag article p {
    text-align: right;
    padding-left: 10px;
    padding-right: 10px;
}

section#endustriyel .polygon .sag .background .lines .line-2 {
    margin-top: 214px;
    margin-left: 377px;
    overflow: hidden;
    text-align: center;
    z-index: 4;
}

section#endustriyel .polygon .sag .background .lines .line-2 img {
    margin-top: 55px;
}

这就是它的样子。

http://i.stack.imgur.com/iDWBv.jpg

我想要一个jquery或javascript。有没有人可以帮助我？