JavaScript для прокрутки длинной страницы к DIV

В Java все переменные, которые вы объявляете, на самом деле являются «ссылками» на объекты (или примитивы), а не самими объектами.

При попытке выполнить один метод объекта , ссылка просит живой объект выполнить этот метод. Но если ссылка ссылается на NULL (ничего, нуль, void, nada), то нет способа, которым метод будет выполнен. Тогда runtime сообщит вам об этом, выбросив исключение NullPointerException.

Ваша ссылка «указывает» на нуль, таким образом, «Null -> Pointer».

Объект живет в памяти виртуальной машины пространство и единственный способ доступа к нему - использовать ссылки this. Возьмем этот пример:

public class Some {
    private int id;
    public int getId(){
        return this.id;
    }
    public setId( int newId ) {
        this.id = newId;
    }
}

И в другом месте вашего кода:

Some reference = new Some();    // Point to a new object of type Some()
Some otherReference = null;     // Initiallly this points to NULL

reference.setId( 1 );           // Execute setId method, now private var id is 1

System.out.println( reference.getId() ); // Prints 1 to the console

otherReference = reference      // Now they both point to the only object.

reference = null;               // "reference" now point to null.

// But "otherReference" still point to the "real" object so this print 1 too...
System.out.println( otherReference.getId() );

// Guess what will happen
System.out.println( reference.getId() ); // :S Throws NullPointerException because "reference" is pointing to NULL remember...

Это важно знать - когда больше нет ссылок на объект (в пример выше, когда reference и otherReference оба указывают на null), тогда объект «недоступен». Мы не можем работать с ним, поэтому этот объект готов к сбору мусора, и в какой-то момент VM освободит память, используемую этим объектом, и выделит другую.

98
задан ɢʀᴜɴᴛ 25 June 2017 в 10:57
поделиться

12 ответов

Исправьте меня, если я неправ, но я читаю вопрос снова и снова и все еще думаю, что Angus McCoteup спрашивал, как установить элемент, чтобы быть положением: фиксированный.

Angus McCoteup, проверьте http://www.cssplay.co.uk/layouts/fixed.html - если Вы хотите, чтобы Ваш DIV вел себя как меню там, взглянул на CSS там

-2
ответ дан Vitaly Sharovatov 24 November 2019 в 05:06
поделиться

Существует плагин jQuery для общего случая прокрутки к элементу DOM, но если производительность является проблемой (и когда это нет?), я предложил бы делать его вручную. Это включает два шага:

  1. Нахождение положения элемента Вы прокручиваете к.
  2. Прокрутка к той позиции.

quirksmode дает хорошее объяснение механизма позади первого. Вот мое предпочтительное решение:

function absoluteOffset(elem) {
    return elem.offsetParent && elem.offsetTop + absoluteOffset(elem.offsetParent);
}

Это использует кастинг от пустого указателя до 0, который не является надлежащим этикетом в некоторых кругах, но мне нравится он:) Второе использование части window.scroll. Таким образом, остальная часть решения:

function scrollToElement(elem) {
    window.scroll(absoluteOffset(elem));
}

Вуаля!

0
ответ дан Andrey Fedorov 24 November 2019 в 05:06
поделиться

scrollTop (IIRC) - то, куда в документе верхняя часть страницы прокручивается до. scrollTo прокручивает страницу так, чтобы верхняя часть страницы была то, где Вы определяете.

, В чем Вы нуждаетесь вот, стили некоторого JavaScript, которыми управляют. Скажите, хотели ли Вы отделение вне экрана и прокрутку в справа, Вы установили бы левый атрибут отделения к ширине страницы и затем уменьшились бы, это набором составляет каждые несколько секунд, пока это не, где Вы хотите.

Это должно указать на Вас в правильном направлении.

Дополнительный: я сожалею, я думал, что Вы хотели отдельное отделение к 'всплывающему' от где-нибудь (вид подобных, которые этот сайт иногда делает), и не перемещают всю страницу в раздел. Надлежащее использование привязок достигло бы того эффекта.

0
ответ дан Benjamin Autin 24 November 2019 в 05:06
поделиться

Свойство, в котором Вы нуждаетесь, является location.hash. Например:

location.hash = 'вершина';//перешел бы к именованной "вершине привязки

, я не знаю, как сделать хорошую анимацию прокрутки без использования додзе или некоторого инструментария как этот, но если Вам просто нужен он для перехода к привязке, location.hash должен сделать это.

(протестированный на FF3 и Safari 3.1.2)

4
ответ дан Scott Swezey 24 November 2019 в 05:06
поделиться

Ответьте отправленный здесь - то же решение Вашей проблемы.

Редактирование: ответ JQuery очень хорош, если Вы хотите гладкую прокрутку - я не видел это в действии прежде.

5
ответ дан Community 24 November 2019 в 05:06
поделиться

Почему не именованная привязка?

4
ответ дан Bloodhound 24 November 2019 в 05:06
поделиться

Трудность с прокруткой состоит в том, что Вы, возможно, не только должны прокрутить страницу для показа отделения, но Вы, возможно, должны прокрутить внутренние отделения с возможностью прокрутки на любом количестве уровней также.

scrollTop свойство является доступным на любом элементе DOM, включая тело документа. Путем установки его можно управлять, как далеко вниз что-то прокручивается. Можно также использовать clientHeight и scrollHeight свойства для наблюдения, сколько прокрутки необходимо (прокрутка возможна, когда clientHeight (область просмотра) является меньше, чем scrollHeight (высота содержания).

можно также использовать offsetTop свойство для выяснения, где в контейнере элемент расположен.

Для встраивания действительно общей цели "прокручивают в представление" стандартную программу с нуля, необходимо было бы запустить в узле, который Вы хотите представить, удостоверьтесь, что это находится в видимой части, он - родитель, затем повторите то же для родителя, и т.д., полностью пока Вы не достигаете вершины.

Один шаг этого выглядел бы примерно так (непротестированный код, не проверяя пограничные случаи):

function scrollIntoView(node) {
  var parent = node.parent;
  var parentCHeight = parent.clientHeight;
  var parentSHeight = parent.scrollHeight;
  if (parentSHeight > parentCHeight) {
    var nodeHeight = node.clientHeight;
    var nodeOffset = node.offsetTop;
    var scrollOffset = nodeOffset + (nodeHeight / 2) - (parentCHeight / 2);
    parent.scrollTop = scrollOffset;
  }
  if (parent.parent) {
    scrollIntoView(parent);
  }
}
8
ответ дан levik 24 November 2019 в 05:06
поделиться
<a href="#myAnchorALongWayDownThePage">Click here to scroll</a>

<A name='myAnchorALongWayDownThePage"></a>

Никакое воображение, прокручивающее, но это должно взять Вас там.

15
ответ дан mjallday 24 November 2019 в 05:06
поделиться

Если Вы не хотите добавлять дополнительное расширение, следующий код должен работать с jQuery.

$('a[href=#target]').
    click(function(){
        var target = $('a[name=target]');
        if (target.length)
        {
            var top = target.offset().top;
            $('html,body').animate({scrollTop: top}, 1000);
            return false;
        }
    });
23
ответ дан Josh 24 November 2019 в 05:06
поделиться
22
ответ дан George Mauer 24 November 2019 в 05:06
поделиться

старый вопрос, но если кто-то найдет это через Google (как я) и кто не хочет использовать якоря или jquery; есть встроенная функция javascript для «перехода» к элементу;

document.getElementById('youridhere').scrollIntoView();

и что еще лучше; согласно отличным таблицам совместимости в quirksmode, это поддерживается всеми основными браузерами !

369
ответ дан 24 November 2019 в 05:06
поделиться

Я лично считаю, что приведенный выше ответ Джоша на основе jQuery был лучшим, что я видел, и отлично работал для моего приложения ... конечно, я был уже с использованием jQuery ... Я бы точно не стал включать всю библиотеку jQ только для этой единственной цели.

Ура!

РЕДАКТИРОВАТЬ: ОК ... итак, всего через несколько секунд после публикации я увидел другой ответ, только ниже моего (не уверен, что все еще ниже меня после редактирования), в котором говорилось, что нужно использовать:

документ. getElementById ('your_element_ID_here'). scrollIntoView ();

Это работает отлично и требует гораздо меньше кода, чем версия jQuery! Я понятия не имел, что в JS есть встроенная функция под названием .scrollIntoView (), но она есть! Итак, если вам нужна нарядная анимация, перейдите на jQuery. Быстро и грязно ... используйте это!

0
ответ дан 24 November 2019 в 05:06
поделиться
Другие вопросы по тегам:

Похожие вопросы: