Второй вариант сделал, он проще. В первом по нажатию на кнопку раскрывались все блоки, наверное какой числовой идентификатор нужно ставить, а я ничего не нашел.
Во втором варианте вместо кнопки сделал полоску поверх картинки, которая будет внизу, да и плюс - раскрываться елемент будет по нажатию на весь блок, а не только на маленькую полоску.
Но тут последняя проблемка, не хочет убираться эта полоска, по условиям скрипта, который вы написали. Я правда его продублировал, с условием больше двухсот. Или может я снова где-то косячу.
http://memkey.net/blockheight/b.html
<html>
<head>
<title>11</title>
<style>
.shell {
background:#CCCCCC;
width:700px;
}
.middle {
float:left;
position:relative;
margin:0 auto;
background-position:center}
#lom, .lom {
float:left;
max-height: 200px;
overflow:hidden;
position:relative;
}
.lom {
cursor:pointer;
}
.lom:hover {
max-height: 200px;
overflow:hidden;
position:relative;
}
#lom.lomclicked, .lomclicked {
float:left;
height: 100%;
max-height: 100%;
overflow:hidden;
position:relative;
}
.shortbutt {
float:left;
position:absolute;
margin-top:180px;
background:#000000;
color:#FFFFFF;
width:100%;
height:20px;
}
.shortbuttclicked {
display:none;
}
.clear {
clear: both!important;
}
</style>
<script type="text/javascript">
if (document.getElementById('lom').offsetHeight >= 200) {
document.getElementByClassName("shortbutt")[N].style.display = "none";
}
else {
document.getElementByClassName("shortbutt").style.display = "block";
}
</script>
<script type="text/javascript">
if (document.getElementById('lom').offsetHeight <= 200) {
document.getElementByClassName("shortbutt")[N].style.display = "none";
}
else {
document.getElementByClassName("shortbutt").style.display = "block";
}
</script>
</head>
<body>
<div class="shell">
<center>
<div class="middle">
<div class="lom" onMouseUp="this.className='lomclicked';">
<div class="shortbutt">показать полностью</div>
<img src="iphone.jpg" />
</div>
</div>
</center>
</div><div class="clear"></div><br /><br />
---------------------------------Картинка менее 200px------------------------------------------------
<div class="shell">
<center>
<div class="middle">
<div class="lom" onMouseUp="this.className='lomclicked';" style="position:relative;">
<div class="shortbutt">показать полностью</div>
<img src="iphone_small.jpg" />
</div>
</div>
</center>
</div><div class="clear"></div><br /><br />
</body>
</html>
вот архив, если что
http://memkey.net/blockheight/blockheight.zip