Прокрутка палочек / прыжков на второй половине сайта - PullRequest
1 голос
/ 09 июля 2019

Когда я прокручиваю свой сайт вниз, он всегда торчит / прыгает прямо на полпути. Я не уверен, что вызывает это.

Я пытался изменить "высоту" на "минимальную высоту" (я слышал, что работает) Честно говоря, я не знаю, с чем это связано. Я не особо старался.

Я не уверен, что публиковать, но это код, соответствующий области сайта, где придерживается прокрутка.

.tools {
    background: url('../img/tools.png') no-repeat;
    position: relative;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;

    min-height: 25%;
    position: absolute;
    color: #fff;
    font-size: 800%;
    font-family: 'Century Gothic';
}

.toolsinfo {
    background: url('../img/tools.png') no-repeat;
    position: relative;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;

    font-size: 150%;
    overflow: auto;
    padding: 50px 80px;
    background-color: #323232;
    color: #f2f2f2;
}

#bar {
    min-height: 30px;
    background: url('../img/bar1.png') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 1px;
    margin: 0px;
}
<section>
    <div id="bar"></div>
</section>

<div id="paralax2" class="tools">
    <h2 style="font-size:25%; padding-top:50px; color: black">Skills and Tech</h2>

    <div id="" class="toolsinfo">
        <div class="icons" style="padding-top:100px;">
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
            </div>
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
            </div>
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
            </div>
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
            </div>
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.pngg" />
            </div>
        </div>

        <div class="icons" style="padding-bottom:100px;">
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
            </div>
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
            </div>
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
            </div>
        </div>

        <div>
            <div class="icon" style="padding: 20px 20px 20px 20px;">
                <a class="link" href="#">
                    <img src="https://img.icons8.com/material/4ac144/256/camera.png" />
                </a>
            </div>
        </div>

    </div>

    <div class="bar2">
        <section>
            <div id="bar"></div>
        </section>
    </div>
</div>
...