Я пытаюсь адаптировать это:
var h2=$('.block h2');
var divh=$('.block').height();
while ($(h2).outerHeight()>divh) {
alert('enters while');
$(h2).text(function (index, text) {
return text.replace(/\W*\s(\S)*$/, '...');
});
}
как описано здесь: Кросс-браузеры с многострочным переполнением текста с эллипсисом, добавленным в ширину и постоянную высоту div?
Проблема, с которой я столкнулся в моем случае, состоит в том, что у меня есть различные li
, где каждый содержит .block
, который имеет тег h2
за li
Пример:
<li>
<div class="block">
....
<h2>Tittleasfasjgpashgj9ahgpasgnapsighapighapsogna</h2>
...
</div>
</li>
<li>
<div class="block">
....
<h2>5Tittleasfasjgpashgj9ahgpasgnapsighapighapsogna</h2>
...
http://i.stack.imgur.com/lI82f.jpg
Имея .block
с 200px, внутри img
установлено значение height: 90px;
и padding: 5px
, теперь мне нужно взять высоту слева под img и сравнить с высотой h2
.
Но он тоже не работает, он просто не делает if, но divh
содержит данные (200, 200px установлен в css).
Edit:
Итак, я просто выясню, что лучший способ исправить это - установить высоту тега h2
и сравнить его высоту содержимого с установленной.