Форум

bruklin24 · #1 (**permalink**) 14.01.2011, 03:12

Вот в чем проблема:помогите плиз!
Имеется 2 дива. Внутренний содержит текст и изображения,причем он больше внешнего!в "данный" момент видна некоторая часть текста. Хочу при нажатии на ссылку чтобы раздвигался внешний див до тех пор пока есть контент во внутреннем!(т.е. стала видна вся информация в этом блоке) И при повторном нажатии на "эту же " ссылку блок возвращался в исходное положение.

Изменить высоту блока получилось сделать ТАК:
<script type="text/javascript">

$("#podrobnee").click(function(){
$("#divForm").animate({ height: "60%", }, 1500);

});

</script>
Эксперементировал со значением "height" и вот что то получилось... а вот с возвратом блока туговато..(сам только начинаю вникать в скрипты...

ksa · #2 (**permalink**) 14.01.2011, 10:41

Сообщение от bruklin24

при повторном нажатии на "эту же " ссылку блок возвращался в исходное положение

То "исходное положение" нужно либо знать... Либо где-то хранить...

bruklin24 · #3 (**permalink**) 14.01.2011, 11:01

Так вот же... высота исходного блока(divForm) =220px.Хочу при нажатии на ту же ссылку("podrobnee") блок подымался "вверх"(к исходному состоянию)

ksa · #4 (**permalink**) 14.01.2011, 13:16

Сообщение от bruklin24

высота исходного блока(divForm) =220px

Т.е. она постоянная и тебе известна заранее?

Если так:
- Читай размер дива
- Если он не равен 220px - делай таковым. Если равен - делай как делал ранее

ksa · #5 (**permalink**) 14.01.2011, 13:34

Как вариант...

<!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>

bruklin24 · #6 (**permalink**) 18.01.2011, 02:00

Да но... мне нужно чтобы див раздвигался в зависимости от кол-ва содержащегося в нем контента!(и не больше! ) Информация будет разных объемов и поэтому это должно как то просчитываться. А по второму щелчку принимал исходнуюю высоту height=220px;

Вот примерно намалевал;

ksa · #7 (**permalink**) 18.01.2011, 09:29

Сообщение от bruklin24

Вот примерно намалевал

А может пора тестовый пример ваять? Не ленись...

bruklin24 · #8 (**permalink**) 18.01.2011, 12:11

Да я бы рад, да толком нечего предложить. Как я понял нужно сначала считать высоты 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 чувствую себя пока не уверенно )

ksa · #9 (**permalink**) 18.01.2011, 16:37

Сообщение от bruklin24

толком нечего предложить

Например деньги...

Они есть у тебя?

Danilkin500 · #10 (**permalink**) 28.05.2014, 11:19

Привет всем!!! Придерживаюсь к данному вопросу по поводу высоты! Помогите доработать предложенный выше код так чтобы открытие блока формировалось относительно содержимого. Огромное спасибо за помощь заранее!

Форум

Справочник

Discord чат

Курсы javascript