Ответ на пост «Школьное»12
Мне выражение "не работает, переделай" сообщил компьютер. На одном и том же коде!!!
Скачал из интернета шаблон HTML+CSS+JS, внес правки и во время тестов вижу, что отваливается шапка страницы. Но я слишком много правок внес и не знаю, какая из них ломающая. Мало ли, где-то зависимость от класса следующего блока или от фазы Луны.
Решил вносить частями, чтобы определить где и что именно ломается, т.к. визуально неработающие и работающие места -- идентичны! Мало ли как в Python пробелы и табуляция из-за копипаста перемешаются, а скрипт не работает. Выглядят то идентично! Если не включать отображение подобных символов как-то иначе.
Беру исходный шаблон, копирую рядом и... Шаблон перестает работать!
Я бы понял, если где-то в путях прописан путь к каталогу и из-за этого все ломается. Но если работает из моей локальной папки, то, значит, путь относительный, т.к. вряд ли человек угадает куда я его шаблон распакую. Иначе бы отваливалось и в оригинальном шаблоне.
В итоге, на HTML+CSS написал простенькую консоль внутри блока типа:
<p>Переменная А = <i id="idA"></i><p>
UPD: Копипаст наше все отсюда:
После заголовка: Pure-CSS lightbox
https://developer.mozilla.org/ru/docs/Web/CSS/:target
(с помощью CSS зафиксирован всегда сверху, всегда по центру, фон полупрозрачный, добавил z-index)
В JS добавил обновление переменных внутрь подозрительной функции:
var el = document.getElementById('idA');
el.textContent = A;
соблюдая все регистры символов, ибо знаю, что разные языки по разному относятся к регистрам, где-то кладут болт на регистр, все работает, а где-то требуют точное соблюдение регистра.
баг с пропаданием шапки страницы работает только когда страница загружена с шириной больше 992px, потом немного прокручиваю вниз до исчезновения шапки (она становится закрепленной сверху), после чего уменьшаю ширину браузера. При прокрутке в начало шапка остается со свойством "display:none" и не видна.
Но почему в оригинальной странице работает все нормально, а в копии этой же страницы -- нет? КОПИЯ!!! Т.е. вся разница -- это только другое название папки.
С помощью jQuery реализована нужная функция в шаблоне (не моя):
windows.on('scroll', function () {
var scroll = windows.scrollTop();
var headerHeight = header.height();
if (screenSize >= 992) {
if (scroll < headerHeight) {
header.removeClass('display-none');
} else {
header.addClass('display-none');
Перед этим и после есть код. Включая закрывающие скобки.
Оказалось -- headerHeight во второй вкладке умудряется обнулиться! Т.е. я загрузил первую оригинальную страницу, она все нормально отработала. Вторая страница из копии -- после сокрытия каким-то образом умудряется сбросить высоту элемента в ноль. Т.е. он в тот момент был скрыт и его размер реально нулевой, только вот предыдущее состояние, почему-то, не сохранено.
Соответственно, если загрузить в третьей вкладке оригинальную страницу, то и на ней баг стал воспроизводиться!
Обнаружив баг с неверной высотой элемента стал думать как порешать и тот. Чтобы правильно запоминалась высота элемента. Но потом -- а не пофиг ли? В самом верху значение scroll будет равно нулю. Значит, нужно либо второй элемент увеличить на единицу, если он занулится, либо поменять оператор сравнения < на <=
Т.е. будет:
if (scroll <= headerHeight+1)
(применил оба исправления, хуже не будет, я на это надеюсь, от JS всего можно ожидать)
Кучу времени убил на то, чтобы узнать, что нужно было добавить или знак равенства, или поставить +1.
Хуже только узнать, что Python-скрипт не работает потому, что где-то отступы отформатированы пробелами, а где-то -- табами. Например, при копипасте, в котором пробелы, когда сам используешь табы...
Пробел -- это "ноль", таб -- это "единица", вот тебе машинный код, иди ищи баги..
P.S. я JS не знаю... Просто думаю такой: ну, вроде, он похож на язык программирования, который я знаю...
IT-юмор
7.1K поста53.2K подписчиков
Правила сообщества
Не публикуем посты:
1) с большим количеством мата
2) с просьбами о помощи
3) не относящиеся к IT-юмору