Сворачивающийся текст с обтеканием.
Добрый вечер.
Хочу сделать описание, которое будет разворачиваться в полный объем и обтекать картинку. Но javaScript не хочет делать это вместе. После выполнения замены стилей, обратное действие в блоке else выполняется только для изменения height, а overflow обратно в hidden не хочет уходить. Прошу помощи :help: (function () { var flag = true; $("button").click(function () { if (flag) { var height = $("#tab-description").css("height", "auto").height(); var overflow = $("#tab-description").css("overflow", "visible"); $("#tab-description").css("height", "95px") $("#tab-description").animate({"height": height}); $("#tab-description").css("overflow", "hidden") $("#tab-description").animate({"overflow": overflow}); } if(!flag) { $("#tab-description").animate({"height": "95px"}); $("#tab-description").animate({"overflow": "hidden"}); } flag = !flag; }); })() |
mbrogan,
animate предназначено только для цифровых значений |
Цитата:
|
Цитата:
|
mbrogan,
попробуйте сделать через .toggleClass() используя только css |
Цитата:
(function () { var flag = true; $("button").click(function () { if (flag) { var height = $("#tab-description").css("height", "auto").height(); var overflow = $("#tab-description").css("overflow", "visible"); $("#tab-description").css("height", "106px") $("#tab-description").animate({"height": height}); document.getElementById('tab-description').style.overflow = 'visible'; } else { document.getElementById('tab-description').style.overflow = 'hidden'; $("#tab-description").animate({"height": "106px"}); } flag = !flag; }); })() Причем пришлось переставлять местами document.getElementById('tab-description').style.overflow = 'hidden'; $("#tab-description").animate({"height": "106px"}); почему то не хотел работать. |
Цитата:
$("#tab-description").css("overflow", "visible"); если пишите на jquery не мешайте с js, по желанию. |
Цитата:
|
Часовой пояс GMT +3, время: 19:29. |