Отклеивание липкого текстового элемента после изменения размера видового экрана?
В настоящее время у меня есть выровненный по левому краю липкий текстовый блок, который становится липким в определенной точке прокрутки, в то время как изображения справа свободно прокручиваются. Это, кажется, прекрасно работает на больших видовых экранах (есть небольшой вертикальный скачок текста примерно на 630 пикселей вниз, я могу жить с этим, но если кто-то знает, как сделать это более плавным, не стесняйтесь поделиться!). На небольших видовых экранах текстовый элемент занимает 100% ширины над изображениями, когда все переключается на один столбец.
Проблема в том, что текст все еще липкий на этих небольших видовых экранах (он должен просто перестать прилипать и стать прокручиваемым). Это также заставляет непосредственное изображение ниже прыгать вокруг.
Я настроил codepen, если кто-то хочет взглянуть, и полностью открыт для любого решения!
Сайт CodePen Ссылку
Что я уже пробовал:
Я попытался добавить код jQuery, который отключил бы липкую прокрутку на чем-либо под 948px, но мне не повезло с его работой (обратите внимание, что я удалил этот код из публикации). Я также пробовал css media query (position и т. д.), Но, похоже, ничего не вышло.