Я пытаюсь создать одностраничное веб-приложение, поэтому весь пользовательский интерфейс загружается в DOM одновременно, но только его части видны пользователю одновременно.
ПервоначальноЯ установил для элементов экрана значение display:none
, но это нарушило анимацию / переходы, которые я хотел использовать, чтобы отобразить / скрыть элементы.
То, что я сейчас делаю, - это перемещение элементов за пределы экрана путем регулировки непрозрачности / положенияи т. д. и как только он окажется вне поля зрения, я установил класс для элемента, который его обрезает, следующим образом: clip: rect(0, 0, 0, 0)
, чтобы он не мешал экранным элементам и пользователь не мог щелкнуть по нему.
Это работало хорошо, но мой вопрос: есть ли лучший / более эффективный способ сделать это?Я думаю, я беспокоюсь, если скорость может быть проблемой, так как все больше и больше элементов загружаются в DOM по мере роста приложения.
Так что я ищу наиболее эффективный способ скрытия элементов, чтобы браузер мог эффективнотолько сделка с экранными элементами.
Спасибо за любые предложения.