0 Пользователей и 1 Гость просматривают эту тему.
  • 11 Ответов
  • 1206 Просмотров
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
[Решено] Прокрутка на JQ
« : 25.10.2014, 15:27:57 »
Как на jQuery прокрутить страницу до отображения на видимой части экрана определенного #элемента, да так, чтобы его позиция от верхней границы экрана составляла определенное значение и.
Предварительно надо сделать проверку, а он вообще в границах экрана, и если нет - крутить.
Конкретно, речь идет о элементе, скрытом в подменю главного меню. Как открыть это подменю - знаю, а дальше делать прокрутку, если элемент не виден или виден частично.
Как это можно реализовать?
« Последнее редактирование: 26.10.2014, 23:21:32 от AlekVolsk »
*

Fedor Vlasenko

  • Живу я здесь
  • 3842
  • 724 / 7
  • Все начинается с Value
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
Re: Прокрутка на JQ
« Ответ #2 : 25.10.2014, 16:29:29 »
СПС, птсмотрю )
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
Re: Прокрутка на JQ
« Ответ #3 : 25.10.2014, 20:15:11 »
Получилось, спс:
Код: javascript
  function getScrollTop() {
    var scrOfY = 0;
    if (typeof(window.pageYOffset) == "number") {
      scrOfY = window.pageYOffset;
    } else if (document.body && (document.body.scrollLeft || document.body.scrollTop)) {
      scrOfY = document.body.scrollTop;
    } else if (document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop)) {
      scrOfY = document.documentElement.scrollTop;
    }
    return scrOfY;
  }

  var link = $('.' + plg_pc_initclass + '.user-guest'); // plg_pc_initclass - переменная, задается инлайн из параметров
  var loginform = $('#login-form');
  var loginlink = $(loginform).parents('li').first();
  var lltop = $(loginlink).offset().top - 30;

  if (($(link).length) && ($(loginform).length)) {
    $(link).each(function(idx,el) {
      $(el).on('click', function() {
        $(loginlink).trigger('click');
        var wtop = getScrollTop();
        if (wtop > lltop)
          $('html,body').animate({scrollTop:lltop},500);
        $('input[name="username"]').trigger('focus');
        return false;
      });
    });
  }
*

Fedor Vlasenko

  • Живу я здесь
  • 3842
  • 724 / 7
  • Все начинается с Value
Re: Прокрутка на JQ
« Ответ #4 : 25.10.2014, 20:34:26 »
очень плохо getScrollTop на js у тебя же есть jQuery
var link = $('.' + plg_pc_initclass + '.user-guest');
поиск элемента по классу распространенная ошибка(логики)
ты проверяешь у всех элементов классы. В таких случаях стоит ограничивать поиск к примеру $('div.myclass') а лучше к ид всегда привязыватся
так-же ты вешаешь множество обработчиков в цикле, когда можно было написать нечто
Код: javascript
$('#myid').on('click', 'div.myclass',function() {});
повесив всего один обработчик
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
Re: Прокрутка на JQ
« Ответ #5 : 25.10.2014, 20:49:28 »
getScrollTop - копипастинг с javascript.ru по поиску в яндексе.

В ленте новостей в каждой почти новости строчка: доступен для загрузки из личного кабинета.
Ссылка в материале имеет вид <a class="myclass">личного кабинета</a>, контент-плагин  добавляет класс в зависимости от того, зареген ли юзер или нет, и добавляет скрипт клика по ссылке с классом. По какой из 10 имеющихся ссылок на странице кликнет юзер - вопрос, такое сочетание классов более нигде не встречается на сайте гарантированно: плагин знает о myclass из своих настроек, он там супер-уникальный.
И на главной и когда открываешь новость отдельным материалом, и когда открываешь ленту новостей. Общий контейнер - тот, что является родителем вывода компонента в шаблоне. Как это упростить - не придумал пока.

Если пользователь уже зареген, скриптом же редирект в личный кабинет )
А если не зареген и на странице нет #login-form (стандартный id формы авторизации, не меняется с 2.5, а может быть и раньше), то редирект на index.php?option=com_users&view=login
« Последнее редактирование: 25.10.2014, 21:02:24 от AlekVolsk »
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
Re: Прокрутка на JQ
« Ответ #6 : 26.10.2014, 11:49:18 »
Не смог window.pageYOffset перевести на jq
*

fsv

  • Живу я здесь
  • 2665
  • 384 / 2
Веб-разработка: заказ. Только сложная и объемная разработка. Дорого.
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
Re: Прокрутка на JQ
« Ответ #8 : 26.10.2014, 16:43:08 »
Это не то. offset и position определяют значение от границы документа и всегда фиксированы при прокрутке (если при прокрутке не меняется их позиция другим скриптом).

window.pageYOffset определяет положение документа по вертикали относительно верхней границы окна браузера и изменяется в зависимости от положения вертикального скроллбара.
$(window).offset().top и $(window).position().top возвращают undefined.

Конечная задача функции: получить значение положения вертикального скроллбара, т.е. насколько px документ прокручен по вертикали.
« Последнее редактирование: 26.10.2014, 17:32:59 от AlekVolsk »
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
Re: Прокрутка на JQ
« Ответ #9 : 26.10.2014, 17:37:46 »
В общем, перерыл все, что только можно, решения на jq не нашел, во всех примерах и обсуждениях только решение-симбиоз, js+jq.
Все, что удалось, так это сократить всю функцию так:
Код: php
  function plg_pc_getScrollTop() {
    return (window.pageYOffset != undefined)? window.pageYOffset : document.documentElement.scrollTop;
  }
*

zomby6888

  • Завсегдатай
  • 1473
  • 171 / 3
Re: Прокрутка на JQ
« Ответ #10 : 26.10.2014, 18:13:19 »
интернет-блог: http://websiteprog.ru
*

AlekVolsk

  • Гуру
  • 6906
  • 409 / 4
Re: Прокрутка на JQ
« Ответ #11 : 26.10.2014, 18:18:18 »
Ну да, слона-то я и не заметил )) Спс
Решено.
« Последнее редактирование: 26.10.2014, 23:21:11 от AlekVolsk »
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Переход по ссылки и запуск функции? [РЕШЕНО]

Автор warlocksp

Ответов: 19
Просмотров: 299
Последний ответ 21.02.2020, 12:06:24
от warlocksp
[РЕШЕНО] Скроллинг страницы вниз?

Автор warlocksp

Ответов: 3
Просмотров: 194
Последний ответ 02.02.2020, 15:56:55
от warlocksp
Разобраться с небольшим кодом PHP (РЕШЕНО)

Автор Шмайсер

Ответов: 18
Просмотров: 381
Последний ответ 16.01.2020, 21:47:56
от sivers
Как изнутри iframe вызвать внешнюю функцию? [РЕШЕНО]

Автор dm-krv

Ответов: 6
Просмотров: 220
Последний ответ 25.08.2019, 20:41:07
от dm-krv
Как получить объект с полной информацией о материале через API Joomla? [РЕШЕНО]

Автор dm-krv

Ответов: 4
Просмотров: 308
Последний ответ 03.08.2019, 16:30:51
от dm-krv