Как прокрутить вверх и загрузить iframe

Question

У меня есть галерея изображений некоторых книг, которые я рецензирую. Когда кто-то нажимает на книгу на странице, у меня вверху появляется фрейм, где я указал свой атрибут, чтобы загрузить рецензию на книгу.

<iframe height="300px" width="100%" src="" name="iframe_reviews"></iframe>

<li class="one_quarter"><a href="b_reviews/book4.html" target="iframe_reviews"><img src="b_reviews/images/book4.jpg"></a></li>

Этот код работает отлично. У меня проблемы с тем, что у меня есть несколько книг на странице. Это означает, что вам нужно прокрутить вниз, чтобы увидеть книги, и если вы нажмете на книгу, она загрузится в iframe, но вы не сможете сказать, что она... вы все равно застряли в нижней части страницы.

Есть ли способ нацелить _top после нажатия на ссылку, чтобы обзор книги загружался в iframe, и страница одновременно прокручивалась вверх? Спасибо.

Answer 1

Вы должны быть в состоянии сделать это с помощью функции Javascript и свойства DOM 'scrollTop'. Просто назначьте ссылку на функцию Javascript (используя событие onClick, поэтому функция вызывается при щелчке по ссылке), которая устанавливает для свойства значение 0 (document.body.scrollTop = 0).

HTML:

<a href="b_reviews/book4.html" target="iframe_reviews" onclick="scrollToTop()">...</a>

Javascript:

function scrollToTop() {
    document.body.scrollTop = 0;
}

В качестве альтернативы, вы можете просто назначить идентификатор тегу и использовать функцию getElementById.

HTML:

<a href="b_reviews/book4.html" target="iframe_reviews" id="book">...</a>

Javascript:

document.getElementById('book').onclick = function(){
   document.body.scrollTop = 0;
};