Коллапс бутстрапа откладывается на показ
Я сделал веб-приложение на Java на основе этого веб-шаблона https://colorlib.com/polygon/gentelella/
(Используя Bootstrap v3.3.6 и jQuery v2.2.3)
Я не менял bootstrap js и css, но коллапс работает без перехода, а этап показа задерживается.
Я мог бы смоделировать это, изменив CSS следующим образом: http://codeply.com/view/mLlDDWAF1G
Мне нужно, чтобы он работал мгновенно при нажатии. Не могли бы вы чем-нибудь помочь, пожалуйста?
Спасибо, Филип
Ответы 1
Пользовательское свойство перехода, переопределяющее свертывание начальной загрузки по умолчанию. Когда вы удалите его, переход будет плавным и мгновенным. Удалите переход, определенный в следующем CSS:
.collapsing {
-webkit-transition: none;
transition: none;
visibility: hidden;
}
.collapse.show {
-webkit-transition: none;
transition: none;
visibility: visible;
}
Если вы все еще хотите уменьшить задержку коллапса, чем в файле bootstrap.js, вы можете уменьшить значение Collapse.TRANSITION_DURATION, и все готово.
@ColinCline Я предложил удалить этот CSS вместо добавления этого CSS, потому что этот CSS переопределяет переход начальной загрузки по умолчанию, и вы можете видеть, что это не гладко. Кроме того, я обновил свой ответ и добавил способ уменьшить продолжительность перехода.
Проблема больше не в продолжительности перехода. Как вы наиболее модифицируете setTimeOut(), если он существует в bootrtap js или transition-delay, для этого требуется переопределение жесткого ядра.
@ColinCline Я согласен с вашей точкой зрения, это переопределит поведение начальной загрузки по умолчанию. Но изменить продолжительность перехода невозможно, поскольку здесь Flip использует класс коллапса начальной загрузки. Единственный способ добиться этого без переопределения CSS начальной загрузки - избежать использования класса collapse для начальной загрузки и написать собственный.
Согласитесь, создание нестандартного - лучшее решение, но я думаю, что для OP это может быть сложно.
Я также просмотрел документацию по начальной загрузке, и они не позволяют делать это динамически, а значение Collapse.TRANSITION_DURATION жестко запрограммировано в файле bootstrap.js.
Позвольте нам продолжить обсуждение в чате.
Спасибо за советы. Ничего из этого не решило мою проблему. Единственное решение, которое я вижу, - это написать собственный класс, но для меня это не такая уж большая ошибка, поэтому я оставлю все как есть. Еще раз большое спасибо.
Разве OP не сделал то же самое в своей кодовой ссылке! Проблема больше не в переходе, это
timeout(). «Мне нужно, чтобы он работал мгновенно». Вы просто копируете / вставляете код OP в качестве ответа!