slideDown и абсолютное позиционирование
Всем здравствуйте.
Есть ламерский вопрос - буду признателен если кто поможет. Есть блок родитель с дочерним блоком к примеру <style> .parent{ position: relative; border: 1px solid #000; width: 500px; } .child{ display: none; position: absolute; } .button{ cursor: pointer; padding: 10px 0; width: 150px; text-align: center; border: 1px solid #000; } </style> <div class="button"> ВКЛ. ВЫКЛ :) </div> <div class="parent"> <div class="child"> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio aperiam repellat sint rem assumenda perferendis minus repudiandae error modi recusandae, reprehenderit iste ipsam ullam quae autem totam minima obcaecati officiis! </div> </div> Какой то текст <script> $(document).ready(function() { $(".button").click(function() { if ($('.child').is(':visible')) { $('.child').slideUp(); } else { $('.child').slideDown(); } }); }); </script> Дочерний блок как видно по стилям абсолют и невидимый, но он появляется и исчезает при нажатии некой кнопки с помощью slideUp slideDown (да не с помощью slideToggle) но он не влияет на высоту родительского блока так как имеет абсолютное позиционирование. Можно ли сделать так что бы родительский блок вел себя так вроде как абсолютного позиционирование не было бы? А именно что бы родитель принимал высоту своего контента, только не по окончании анимации а во время ее действия. Только еще надо учесть что блоков таких как дочерний может быть несколько |
Цитата:
Что оно вам даёт ? |
Deff,
Ну это я упрощенно дал верстку, там все более запутано - там идут вкладки во вкладках с табами и так получается что тело контента в позишн абсолют. Ну что то похожее на выпадающее меню где подменю в позишн абсолют. Короче абсолют отменить не вариант - много переделывать придется. Надо просто сделать что бы родитель растягивался за своим абсолютным контентом. |
Bond,
Тады считаете сумму высот нескрытых дочерних и задаёте эту высоту родителю (наверно вставкой подсчета и записи css в процессе анимации |
Deff,
Да но это можно сделать по окончанию слайда, я так и сделал поначалу но не вариант думаю - получается заканчивается слайд а потом за ним я увеличиваю родителя. Можно так но не желательно. |
Bond,
Ну дык в процессе анимации и анимируете одновременно и высоту родителя |
Но вообщем задача высосана из пальца, ибо проще не делать абсолютную позицию, скорее всего лень было ставить margin - поставили top и left
Мон у дочерних делать position:relative; margin:auto; И позиционировать тем жа top и left ================ Лучше приводить ссылки на полный HTML c проблемами для реальных советов |
Deff,
В этом и вопрос - как это сделать ) Немного не хватает знаний... |
Deff,
Нет, топ лефт не вариант - там 8 табов, и получается под каждый писать топ лефт не вариант - если добавиться 9-й таб его контент тоже придется настраивать. Без абсолюта можно было бы сделать если вынести контент из табов отдельно - но другая загвоздка есть - верстка респонс - для мобилы надо что бы контент был в своем табе а не отдельно. Решил сделать по другому - убрал слайд, сделал просто дисплей блок или none а после пересчитываю высоту родителя. Все происходит мгновенно. Deff, спасибо за участие |
Bond,
блин, еще раз, я не понимаю, если там тьма табов с абсолютом, наверно нун выбирать наибольший по высоте(а не сумму) ? Легче дать ссыль на реальную страницу и спрашивать! |
Deff,
Реальной пока не было, но уже есть http://1.perevozki-ok.ru/gorod/ Табы о которых речь под блоком Грузовое такси Москва с текстом "Что Вас интересует?" слева. Вот такие табы - их не тьма а 8 штук абсолют задан потому что удобно для всех прописать left 0 right 0 относительно самого главного блока чем задавать им margin для каждого свой. А весь контент выносить отдельно тоже не вариант потому что посмотрите как должно быть при ширине монитора ниже 960 пикс На сайте пока бардак, много лишнего есть, но думаю по вкладкам разберетесь Слайд был при клике на текст Открыть вкладку выезжал контент, и за ним надо было растягивать самый первый родитель. |
Bond,
Ну обрами все табы в div с position;relative; и задай ему максимальную высоту и ширину из всех табов ? |
Deff,
В принципе так решил, просто для мобилы слайд сделаю, а для пк будет как есть. А высоту задавать не вариант - может быть слишком много пустого места внизу - там во внутренних вкладках будет текст может быть и 100 строк + возможно картинка. Да и самих вкладок будет много Решили так как сейчас оставить - хотя со слайдом было бы лучше. |
Часовой пояс GMT +3, время: 21:18. |