@GreenMan1899

Почему на MacOS криво работает кнопка наверх?

На сайте через раз, либо на несколько кликов вместо одного на Маках срабатывает анимация скроллинга на кнопку наверх.
скрипт обычный
function btnUp() {
    $('html, body').animate( { scrollTop: 0 }, 1000 );
}

На других системах все ок
Грешу на плагин lilLanding
вот его код.
Я не очень шарю чтобы отследить в чем проблема именно в этом коде
/*
 * jQuery liLanding v 2.1
 *
 * Copyright 2013, Linnik Yura | LI MASS CODE | http://masscode.ru
 * Free to use
 *
 * Last Update: 19.06.2016
 */
;(function ($) {
	var methods = {
		init: function (options) {
			var p = {
				show: function (linkEl, landingItem) {}, 
				hide: function (linkEl, landingItem) {},
				topMargin: 0,
				speedFactor: 1
			};
			if (options) {
				$.extend(p, options);
			}
			return this.each(function () {
				var el = $(this);
				var elPos = el.offset().top;
				var wHalf = $(window).height()/2
				var scrollId = function(){};
				
				//assign events only links with anchors
				$('a[href*="#"]',el).on('click',function(){
					var linkItem = $(this);
					if(!linkItem.is('.cur')){
						var linkHref = linkItem.attr('href');
						var linkTarget = $(linkHref);
						var linkTargetPos = linkTarget.offset().top;
						var windowPos = $(window).scrollTop();
						var animDuration = linkTargetPos - windowPos;
						var animDestination;
						var animOffset;

						animOffset = Math.round( parseFloat(linkTarget.css('padding-top')) / 1.5 );
						animDestination = linkTargetPos - parseFloat(p.topMargin) + animOffset;

						// console.log(linkTargetPos, animOffset, animDestination);

						if(animDuration < 0){
							animDuration = animDuration*-1	
						}
						//scroll the page to the desired block
						if(linkTarget.length){
							$('html, body').stop(true).animate({scrollTop: animDestination},animDuration*p.speedFactor,function(){
								$(window).trigger('scroll');
							});
						}
					}
					return false;
				})
				//stop the animation by scrolling
				var mousewheelevt=(/Firefox/i.test(navigator.userAgent))? "DOMMouseScroll" : "mousewheel" //FF doesn't recognize mousewheel as of FF3.x
				if (document.attachEvent) //if IE (and Opera depending on user setting)
					document.attachEvent("on"+mousewheelevt, function(e){
						$('html, body').stop(true);		
					});
				else if (document.addEventListener) //WC3 browsers
					document.addEventListener(mousewheelevt, function(e){
						//e.detail //direction
						$('html, body').stop(true);
					}, false)
				//highlight the desired link in the menu by scrolling
				$(window).on('scroll',function(e){
					clearTimeout(scrollId);
					var windowPos = $(window).scrollTop();
					if(windowPos > elPos){
						el.addClass('landingFix');	
					}else{
						el.removeClass('landingFix');	
					}
					scrollId = setTimeout(function(){
						$('.landingItem').each(function(){
							var landingItem = $(this);
							var landingItemHeight = landingItem.height();
							var landingItemTop = landingItem.offset().top - wHalf;
							var linkHref = landingItem.attr('id');
							var linkEl = $('a[href="#'+linkHref+'"]',el);
							var status;

							if(windowPos > landingItemTop && windowPos < (landingItemTop + landingItemHeight)){
								if(!linkEl.is('.cur')){
									linkEl.addClass('cur');
									if (p.show !== undefined) {
										p.show(linkEl, landingItem);
									}
								}
							}else{
								if(linkEl.is('.cur')){
									linkEl.removeClass('cur');
									if (p.hide !== undefined) {
										p.hide(linkEl, landingItem);
									}
								}
							}
						});
					},100);
				})
				$(window).trigger('scroll');
			});
		}
	};
	$.fn.liLanding = function (method) {
		if (methods[method]) {
			return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
		} else if (typeof method === 'object' || !method) {
			return methods.init.apply(this, arguments);
		} else {
			$.error('Метод ' + method + ' в jQuery.liLanding не существует');
		}
	};
})(jQuery);
  • Вопрос задан
  • 160 просмотров
Пригласить эксперта
Ответы на вопрос 1
@alexalexes
У вас очень тяжелый файл www.annalev.ru/static/bundle/js/bundle.min.js, в котором лежит функция скроллинга, пока он не загрузиться на клиенте полностью, скроллинг не будет работать.
Решить проблему можно несколькими путями:
1) Все легковесные функции, которые не зависят от библиотек поместить в отдельный файл, который будет подключаться выше списком, чем тяжеловесные js.
2) Написать код легковестных функций прямо в документе (или в общем шаблоне страниц, где описывается head или footer, в случае если у вас CMS);
3) Написать обработчик скроллинга непосредственно в атрибуте onclick.
PS: Дополнительно, посмотреть, какой функционал можно "выбросить" в подключенных библиотеках.
Например, на JQuery можно опционально отключать некоторые возможности и скачивать js-файл значительно меньших размеров, чем в полной комплектации.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
22 нояб. 2024, в 00:55
500 руб./за проект
21 нояб. 2024, в 23:30
300000 руб./за проект
21 нояб. 2024, в 22:21
3000 руб./в час