Как сделать динамическое изменение ширины на jQuery?

Question

[Хабиб Омаров]

Добрый день, У меня возникла такая проблема:
У меня на сайте есть левый вертикальный блок меню который скрывается при клике на кнопку hdiemenu, и соответственно влево от него блок контента по умолчанию ширина 800px. Хочу сделать так чтоб при клике на кнопку hdiemenu ширина контента расширялась учитывая имеющуюся ширину, тоесть чтоб она прибавляла к 800 ширину блока 250px.
Помогите незнаю как сделать.
И еще, кнопка hdiemenu является переключателем. Тоесть это кнопка скрывает и показывает блок меню. Если нажать скрыть то должна прибавлять к 800 ширину 250px, а если нажать повторно тоесть показать то должна убавлять 250px. Надеюсь вы поняли меня

Answer 1

[Misha7]

Делайте с помощью animate jquery
animate

Comments

[Хабиб Омаров]

без эффекта анимации можно?

[Misha7]

Да, метод css. То есть в скрипте переключения, размера меню, пишите $('.Класс контента').css({'width':'1025'});

[Хабиб Омаров]

Misha7: Дело в том что ширина 800px не фиксированная, то есть скриптом определяется ширину экрана и задает его блоку

Answer 2

[Quickerz]

Метод width позволит получать ширину нужного элемента. В вашем случае получаете ширину основного контента, ширину меню (если она не фиксирована) и потом прибавляете одно значение к другому.

Comments

[Хабиб Омаров]

Этого я добился, нужно эффект переключения, при нажатия прибавляла потом при нажатии убавляла

[Quickerz]

Тут нужно смотреть на конкретный случай. Можно сохранять ширину в data атрибут либо глобальную переменную, а потом восстанавливать её до начального значения. Можно просто добавлять и удалять классы, с помощью которых скрывать/показывать меню и задавать основному содержимому 100%/80%(к примеру) ширину. Как я понял, ширина основного содержимого задаётся относительно ширины окна и последний вариант может неплохо подойти в вашем случае. Если нет, то опишите подробнее все исходные данные, чтобы можно было советовать что-то конкретное.