Новости Joomla

Вышли релизы безопасности Joomla 5.3.4 и Joomla 4.4.14

Релиз безопасности Joomla 5.3.4

Проект Joomla спешит сообщить о выпуске Joomla 5.3.4 и Joomla 4.4.14. Это релиз безопасности для серии Joomla 5.3 и релиз безопасности для серии Joomla 4.4.

0 Пользователей и 1 Гость просматривают эту тему.
  • 9 Ответов
  • 1573 Просмотров
*

AlekVolsk

  • Гуру
  • 6913
  • 416 / 4
Имеется жестко зафиксированный хеадер с фиксированной высотой, на jquery при скроллинге ему присваивается доп.класс, у которого указана другая высота, обоим установлен transition на изменение высоты, однако анимация работать не хочет.
js, отрабатывает отлично:
Код: javascript
jQuery(document).on('scroll', function() {
  jQuery(document).scrollTop() > 114 ? jQuery('header').addClass('sm') : jQuery('header').removeClass('sm');
});
css:
Код: css
header {position:fixed;top:0;width:100%;height:164px;transition:height .5s;}
header.sm {height:50px;transition:height .5s;}
Замена transition:height .5s; на transition:all .5s; проблемы не решает.
Как заставить работать?
*

sergoguga

  • Давно я тут
  • 896
  • 70 / 8
  • www.mpbox.ru
Re: transition на изменение высоты блока
« Ответ #1 : 22.07.2014, 22:33:20 »
не будет работать, дяловой!!
>>> Верстка 100 евро - ждешь новый курс? Пиши!
>>> Создание моб. приложений по ГОСТу)))! Личка работает!
>>> Микроразметка по стандартам - цены адекват! Пиши, не боись!
>>> Личный кабинет на ZOO - уже сделан! Пиши в личку, не стесняйся!
*

AlekVolsk

  • Гуру
  • 6913
  • 416 / 4
Re: transition на изменение высоты блока
« Ответ #2 : 22.07.2014, 23:12:46 »
А почему тогда здесь работает?
*

AlekVolsk

  • Гуру
  • 6913
  • 416 / 4
Re: transition на изменение высоты блока
« Ответ #3 : 23.07.2014, 00:17:52 »
Сделал, применил не к header, а ко вложенному контейнеру:
Код: javascript
jQuery(document).on('scroll', function() {
  jQuery(document).scrollTop() > 114 ? jQuery('.container').addClass('sm') : jQuery('.container').removeClass('sm');
});
Код: css
header {position:fixed;top:0;width:100%;}
header .container {position:relative;height:166px;transition:height .5s;display:block;}
header .container.sm {height:52px;}

Для дех, кто возможно будет наступать на те же грабли: у меня в контейнер также вложено меню, чтобы оно плавно двигалось вместе с контейнером, его надо привязать к нижней границе контейнера (отступы у каждого свои):
Код: css
header .container > .navbar {position:absolute;bottom:0;width:100%;}

Решено.
*

Shustry

  • Moderator
  • 6434
  • 745 / 3
Re: transition на изменение высоты блока
« Ответ #4 : 23.07.2014, 00:28:42 »
А вам не проще было и анимацию в JS вставить?
*

AlekVolsk

  • Гуру
  • 6913
  • 416 / 4
Re: transition на изменение высоты блока
« Ответ #5 : 23.07.2014, 00:29:46 »
Пробовал, не смог увязать с респонсивом, с js слабовато пока.
*

Shustry

  • Moderator
  • 6434
  • 745 / 3
Re: transition на изменение высоты блока
« Ответ #6 : 23.07.2014, 00:36:34 »
Код: javascript
var container = jQuery('.container');
if (jQuery(document).scrollTop() > 114) {
jQuery(container).addClass('sm').animate({height: '100px'}, 1500 );
} else {
jQuery(container).removeClass('sm').animate({height: '200px'}, 1500 );
}
*

AlekVolsk

  • Гуру
  • 6913
  • 416 / 4
Re: transition на изменение высоты блока
« Ответ #7 : 23.07.2014, 00:41:27 »
У меня также задача стояла: при @media (max-width:767px) {} анимация работать не должна, в этом случае я просто указал transition:none;
*

Shustry

  • Moderator
  • 6434
  • 745 / 3
Re: transition на изменение высоты блока
« Ответ #8 : 23.07.2014, 00:45:33 »
Просто добавить условие:

Код: javascript
var container = jQuery('.container');
if ( (jQuery(document).scrollTop() > 114) && (jQuery(document).width() > 767) ) {
jQuery(container).addClass('sm').animate({height: '100px'}, 1500 );
} else {
jQuery(container).removeClass('sm').animate({height: '200px'}, 1500 );
}
*

AlekVolsk

  • Гуру
  • 6913
  • 416 / 4
Re: transition на изменение высоты блока
« Ответ #9 : 23.07.2014, 00:56:10 »
За пример спасибо.

А если в задаче при этом в момент анимации на изменение высоты происходит анимация на отображение/прозрачность/изменение размеров нескольких элементов внутри контейнера? Достаточно громоздкий скрипт может получится. Имхо, стилями проще, да и скриптов меньше. Пока останусь при своем ;)
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Пакетное изменение вывода изображений

Автор Missile

Ответов: 7
Просмотров: 794
Последний ответ 03.01.2021, 23:11:55
от draff
Изменение размера логотипа для сайта в шаблоне

Автор kunsaid

Ответов: 5
Просмотров: 1120
Последний ответ 03.12.2020, 20:08:56
от kunsaid
Изменение стилей заголовков материалов

Автор Paradox

Ответов: 0
Просмотров: 714
Последний ответ 26.05.2020, 21:50:01
от Paradox
Изменить шаблон вывода блока в категории

Автор zizi6ka

Ответов: 14
Просмотров: 3700
Последний ответ 12.04.2018, 09:21:12
от zizi6ka
Изменение размера меню(буковочки) шаблона protostar

Автор backovadim

Ответов: 1
Просмотров: 836
Последний ответ 28.01.2018, 17:13:54
от draff