Увеличение высоты DIVа по нажатию ссылки
Вот в чем проблема:помогите плиз!
Имеется 2 дива. Внутренний содержит текст и изображения,причем он больше внешнего!в "данный" момент видна некоторая часть текста. Хочу при нажатии на ссылку чтобы раздвигался внешний див до тех пор пока есть контент во внутреннем!(т.е. стала видна вся информация в этом блоке) И при повторном нажатии на "эту же " ссылку блок возвращался в исходное положение. Изменить высоту блока получилось сделать ТАК: <script type="text/javascript"> $("#podrobnee").click(function(){ $("#divForm").animate({ height: "60%", }, 1500); }); </script> Эксперементировал со значением "height" и вот что то получилось... а вот с возвратом блока туговато..(сам только начинаю вникать в скрипты... |
Цитата:
|
Так вот же... высота исходного блока(divForm) =220px.Хочу при нажатии на ту же ссылку("podrobnee") блок подымался "вверх"(к исходному состоянию)
|
Цитата:
Если так: - Читай размер дива - Если он не равен 220px - делай таковым. Если равен - делай как делал ранее |
Как вариант...
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script>
function Go() {
var o = document.getElementById('divForm')
var h=(o.style.height)? parseInt(o.style.height): 100
o.style.height=((h==100)? 200: 100) + 'px'
}
</script>
<style>
#divForm {
width: 200px;
height: 100px;
overflow: hidden;
border: 1px solid;
}
#podrobnee {
width: 100px;
height: 150px;
margin: 10px;
background-color: red;
}
</style>
</head>
<body>
<div id='divForm'>
<div id='podrobnee'>
</div>
</div>
<hr />
<input type='button' value='Go' onclick='Go()' />
</body>
</html>
|
Вложений: 1
Да но... мне нужно чтобы див раздвигался в зависимости от кол-ва содержащегося в нем контента!(и не больше! ) Информация будет разных объемов и поэтому это должно как то просчитываться. А по второму щелчку принимал исходнуюю высоту height=220px;
Вот примерно намалевал; |
Цитата:
|
Да я бы рад, да толком нечего предложить. Как я понял нужно сначала считать высоты 2х дивов!
<script> function setHeight() { var b1 = document.getElementById('divForm'); var b2 = document.getElementById('Description'); if (!b1 || !b2) return; var h1 = b1.offsetHeight; var h2 = b2.offsetHeight; </script> затем сравнить высоты, если неравны то уровнять. Направьте на нужный лад пожалуйста! Помогите разобраться (я новичок, в коде js чувствую себя пока не уверенно ) |
Цитата:
|
Привет всем!!! Придерживаюсь к данному вопросу по поводу высоты! Помогите доработать предложенный выше код так чтобы открытие блока формировалось относительно содержимого. Огромное спасибо за помощь заранее!
|
| Часовой пояс GMT +3, время: 20:09. |