Настройка положения прокрутки при обратной передаче

Я пишу в коде asp.net С#.

Я хочу контролировать позицию страницы в посте. Я не хочу, чтобы значение MaintenanceScrollPositionOnPostback было равным true или false. Значение True слишком низкое, а значение False слишком высокое. Другая проблема заключается в том, что положение должно быть разным в зависимости от того, какой элемент управления нажат. Третья проблема заключается в том, что MaintenanceScrollPositionOnPostback=true работает в IE. но не в фаерфоксе.

Хочу, чтобы я хотел, похож на теги, связанные с href, например. <a href="#body2"> кроме кода.

Спасибо за любые предложения.


person Bob Avallone    schedule 22.06.2011    source источник


Ответы (3)


Предполагая, что вы можете использовать JQuery, попробуйте следующее:

http://beautifulsite.net/blog/2010/01/smoothly-scroll-to-an-element-without-a-jquery-plugin/

Просто введите скрипт и передайте идентификатор элемента управления, который запустил ваше событие обратной передачи.

Если по какой-то причине вы не можете использовать jquery, вот менее элегантный подход:

http://clifgriffin.com/2008/10/14/using-javascript-to-scroll-to-a-specific-elementobject/

Изменить (примеры):

Вот пример прямого html с использованием метода jquery, предполагая, что у вас есть файл скрипта с именем jquery.js в той же папке, что и html-страница.

<html>
<head>
    <script type='text/javascript' src='jquery.js'></script>
    <script type='text/javascript'>
    $(document).ready(function() {
        $('html,body').animate({ 
            scrollTop: $('#scrollHere').offset().top 
            }, 0//increase for smooth, visible scroll
        );
    });
    </script>
</head>
<body>

<div style='width:100px; height:1000px; background-color:red;'>
top filler
</div>

<a id='scrollHere' href='#'>Scrolls to this element</a>

<div style="width:100px; height:1000px; background-color:blue;">
bottom filler
</div>

</body>
</html>

Вот пример метода на стороне клиента, которому вы можете передать свойство «ClientID» любого видимого элемента управления страницей, и он зарегистрирует javascript для прокрутки к элементу при загрузке страницы (предполагается, что jquery зарегистрирован на странице и регистрирует только один звонок по запросу):

private void ScrollToControl(string controlId)
{
    //scroll to button
    string script =
        "$(document).ready(function() {" +
            "$('html,body').animate({ " +
                "scrollTop: $('#" + controlId + "').offset().top " +
            "}, 0);" +
        "});";

    if (!Page.ClientScript.IsStartupScriptRegistered("ScrollToElement"))
        Page.ClientScript.RegisterStartupScript(this.GetType(), "ScrollToElement", script, true);
}
person mtazva    schedule 22.06.2011
comment
JQuery в порядке, но я не могу понять, как это использовать. Можете ли вы дать мне более подробную информацию. Хорошо бы рабочий пример. - person Bob Avallone; 25.06.2011
comment
Спасибо за примеры. Попробовал то, что вы сказали, вариант 2. Ставлю вызов в событии нажатия кнопки. Я получил эту ошибку Ошибка выполнения Microsoft JScript: 'offset().top' имеет значение null или не является объектом - person Bob Avallone; 27.06.2011
comment
Неверное имя поля вызвало эту ошибку. Теперь это работает. Спасибо. - person Bob Avallone; 28.06.2011

Если вы знаете конкретные значения пикселей, где вы хотите, чтобы ваше окно было, вы можете попробовать использовать функцию window.scrollTo() в Javascript.

window.scrollTo(0,0);
person Wicked Coder    schedule 22.06.2011

Поддерживать положение прокрутки страницы при нажатии кнопки:

$("#Next").click(function() { $('html,body').animate(
{ scrollTop: $('.required').offset().top 
}, 0//increase for smooth, visible scroll ); });
person Ranjay Singh    schedule 20.02.2018