Многослойный параллакс эффект в вордпресс

@saimonfreeman · Регистрация: 27.02.2018

Студворк — интернет-сервис помощи студентам

Здравствуйте друзья! Умоляю о помощи!

Я новичок в написании сайтов, изучаю своими силами что могу, что-то знаю, что то нет, не судите строго. Уже 2 недели бьюсь над следующей проблемой:
увидел как то сайт http://www.numero10.ch/fr/home/,
решил сделать что то похожее в вордпрессе в качестве тренировки. Работаю в браузере ФФ, и до недавнего времени все нравилось как выглядит.

Вот до чего я дошел:
http://lionstool-wordpress-1.tw1.ru

В ФФ все просто замечательно, но когда я посмотрел свое "творение" в других браузерах - просто ужаснулся:
Chrome - сильно тормозит, низкое фпс
Опера - чуть быстрее хрома, но очевидные тормоза, фпс также крайне низкое
IE - шустро работает но большинство элементов трясется.

Что использовал:
Для создания параллакс блоков использовал плагин DEX:multilayer parallax.
Для модальных окон - простейший скрипт.

Как пробовал решить:
Пытался менять размер и тип картинок - не помогает
Пытался снизить скорость прокрутки плагином Scrollbar - еще хуже + все контейнеры с position:absolute трясутся
Задавал фон тега html и body - тряска ушла только в IE у логотипов но зато весь сайт поплыл

ПОЖАЛУЙСТА, Подскажите или посоветуйте, что делать, как убрать косяки с параллаксом в других браузерах. Или может есть способ сделать параллаксы без плагина. Почему только в ФФ все идеально выглядит и работает, может что то нужно прописать для остальных бразеров в стилях?.

Заранее всем ответившим +100500 к карме и величайший поклон до земли.

@Уф · 27.02.2018, 19:20

думаю у них используется еще плагин для прокрутки, когда резко вниз ползунок установишь то сайт все равно плавно к нему ползет, а у тебя нет, отсюда тормозов не видно.

можешь попробовать код из этой темы Как изменить скорость прокручивания страницы колёсиком мыши?

@saimonfreeman · 28.02.2018, 13:49 **[ТС]**

Попробовал изменить скорость прокрутки, не сильно лучше стало, но спасибо за совет.

Заметил следующую странность:
Во втором контейнере (черный фон) параллакс блок вставлен на всю высоту контейнера, но в хроме и опере тормозит только верхняя его часть (около 1000 px). Когда прокрутка подходит ко концу блока все начинает работать так как и должно.

Что может загружать верхнюю часть параллакса?

@sad67man · 28.02.2018, 14:47

Там самописный паралакс, и для анимации используется requestAnimationFrame, поэтому он не тормозит.

Новые блоги и статьи Все статьи Все блоги /
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .	PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .

@saimonfreeman 0 / 0 / 0 Регистрация: 27.02.2018 Сообщений: 2

	Многослойный параллакс эффект в вордпресс 27.02.2018, 19:15. Показов 1139. Ответов 3 Метки нет (Все метки) Здравствуйте друзья! Умоляю о помощи! Я новичок в написании сайтов, изучаю своими силами что могу, что-то знаю, что то нет, не судите строго. Уже 2 недели бьюсь над следующей проблемой: увидел как то сайт http://www.numero10.ch/fr/home/, решил сделать что то похожее в вордпрессе в качестве тренировки. Работаю в браузере ФФ, и до недавнего времени все нравилось как выглядит. Вот до чего я дошел: http://lionstool-wordpress-1.tw1.ru В ФФ все просто замечательно, но когда я посмотрел свое "творение" в других браузерах - просто ужаснулся: Chrome - сильно тормозит, низкое фпс Опера - чуть быстрее хрома, но очевидные тормоза, фпс также крайне низкое IE - шустро работает но большинство элементов трясется. Что использовал: Для создания параллакс блоков использовал плагин DEX:multilayer parallax. Для модальных окон - простейший скрипт. Как пробовал решить: Пытался менять размер и тип картинок - не помогает Пытался снизить скорость прокрутки плагином Scrollbar - еще хуже + все контейнеры с position:absolute трясутся Задавал фон тега html и body - тряска ушла только в IE у логотипов но зато весь сайт поплыл ПОЖАЛУЙСТА, Подскажите или посоветуйте, что делать, как убрать косяки с параллаксом в других браузерах. Или может есть способ сделать параллаксы без плагина. Почему только в ФФ все идеально выглядит и работает, может что то нужно прописать для остальных бразеров в стилях?. Заранее всем ответившим +100500 к карме и величайший поклон до земли. 0

@Уф 890 / 725 / 447 Регистрация: 13.07.2015 Сообщений: 2,277
	27.02.2018, 19:20
	думаю у них используется еще плагин для прокрутки, когда резко вниз ползунок установишь то сайт все равно плавно к нему ползет, а у тебя нет, отсюда тормозов не видно. можешь попробовать код из этой темы Как изменить скорость прокручивания страницы колёсиком мыши? 0

@saimonfreeman 0 / 0 / 0 Регистрация: 27.02.2018 Сообщений: 2
	28.02.2018, 13:49 [ТС]
	Попробовал изменить скорость прокрутки, не сильно лучше стало, но спасибо за совет. Заметил следующую странность: Во втором контейнере (черный фон) параллакс блок вставлен на всю высоту контейнера, но в хроме и опере тормозит только верхняя его часть (около 1000 px). Когда прокрутка подходит ко концу блока все начинает работать так как и должно. Что может загружать верхнюю часть параллакса? 0

@sad67man 2603 / 1507 / 689 Регистрация: 23.08.2015 Сообщений: 3,814
	28.02.2018, 14:47
	Там самописный паралакс, и для анимации используется requestAnimationFrame, поэтому он не тормозит. 0