У меня есть ряд ссылок, которые используют механизм привязки:
<div class="header">
<p class="menu"><a href="#S1">Section1</a></p>
<p class="menu"><a href="#S2">Section2</a></p>
...
</div>
<div style="width: 100%;">
<a name="S1" class="test"> </a>
<div class="curtain">
Lots of text
</div>
<a name="S2" class="test"> </a>
<div class="curtain">
lots of text
</div>
...
</div>
Я использую следующий CSS:
.test
{
position:relative;
margin: 0;
padding: 0;
float: left;
display: inline-block;
margin-top: -100px; /* whatever offset this needs to be */
}
Он работает нормально. Но, конечно, он перескакивает с одного раздела на другой, когда мы нажимаем на ссылку. Поэтому я хотел бы иметь плавный переход, используя какой-то прокрутки до начала выбранного раздел.
Я думаю, что я читал в Stackoverflow, что это невозможно (пока) с CSS3, но я бы хотел получить подтверждение, а также хотел бы знать, что "может" быть решением. Я счастлив использовать JS, но я не могу использовать jQuery. Я попытался использовать функцию щелчка по ссылке, получить "вертикальную позицию" div, которую нужно отобразить, но я не увенчался успехом. Я все еще изучаю JS и не знаю его достаточно хорошо, чтобы придумать свое решение.
Любая помощь/идеи были бы оценены.