Как сделать чтобы колонка от контента при открытии, сдвигала сам контент?

Question

[Homise]

Нужно чтобы красная колонка при нажатии на нее, расширялась, а основной контент сжимался. Есть какие идеи? Или ссылки на источники? Заранее спасибо :)

Comments

[rolond]

Если найдешь ответ на свой вопрос, напиши пожалуйста у меня такая же проблема

Answer 1

[Максим Осадчий]

Сделать событие на клик.
Предположим, у зеленого блока ширина 90%, у красной линии - 10, тогда:
$('.red_line_class').on('click', function(){
$(this).css('width', '20%');
$(this).parents().find('.green_block_class').css('width', '80%');
});
Можно напрямую стиль менять, можно по клику менять клас и в css уже дописывать.
Можно дописать toggle, чтобы при повторном клике ширина блоков становилась исходной.

Comments

[Homise]

А как правельно выставить его в html? Через абсолютку не получиться. Через флоут пробовал тоже не особо...

[Максим Осадчий]

Зависит от разметки страницы, дайте ссылку, посмотрю код.

[rolond]

Максим Осадчий: csgoafk.com

Answer 2

[Артур Карапетян]

Аккордеон Вам в помощь

Comments

[rolond]

что такое аккордеон ? )

[Alexander Pushkarev]

rolond: