Цитата:
|
monolithed,
так мне не надо что-бы он скрывался,мне нужно что-бы он был виден целиком,я конечно извиняюсь если вы не понимаете то что я пытаюсь сказать.Мне надо что-бы текст уменьшался.Т.е. что-бы я не вручную каждый раз смотрел где там текст вылезает и применял стиль,а что-бы это было автоматизировано,для этого мне надо-бы посчитать строки. x-yuri, показать,смысле код css? |
niZE то о чем вы просте сделать кроссбраузерно, наверно не невозможно, если конечно не создавать пустую форму для подсчета количества строк (но это бредятина, так не делается).
Цитата:
|
Эта тем полна бреда чуть более чем наполовину.
Товарищу нyжно что-то типа этого:
Обработанный:
<div style="font-size:40px;width:300px;height:45px;overflow:hidden;border:1px solid #000">
Такой вот тут у нас длинный-предлинный текст попался, чтож теперь поделаешь. Сокращать надо бы, но хочется, понимашь, хитрого дизайнерского хода.
</div>
Не обработанный:
<div style="font-size:40px;width:300px;height:45px;overflow:hidden;border:1px solid #000">
Такой вот тут у нас длинный-предлинный текст попался, чтож теперь поделаешь. Сокращать надо бы, но хочется, понимашь, хитрого дизайнерского хода.
</div>
<script type="text/javascript">
var div=document.getElementsByTagName('div')[0],f;
var height=parseInt(div.style.height); //высота блока, если она едина, то лучше задать просто вручную цифрой
while(div.scrollHeight>height&&(f=parseInt(div.style.fontSize)-1)>0)div.style.fontSize=f+'px'; //пока реальныя высота больше назначенной (и font-size>0 - мало ли=) ) уменьшаем размер шрифта на 1px;
</script>
Правильно же это делается тупо обрезкой с добавлением "...". |
Цитата:
Цитата:
|
Цитата:
Обработанный:
<div style="font-size:40px;width:300px;height:45px;overflow:hidden;border:1px solid #000">
Такой вот тут у нас длинный-предлинный текст попался, чтож теперь поделаешь. Сокращать надо бы, но хочется, понимашь, хитрого дизайнерского хода.
</div>
О тут не нужно и обрабатывать:
<div style="font-size:40px;width:300px;height:45px;overflow:hidden;border:1px solid #000">
Такой вот тут у нас длинный-предлинный т
</div>
Ну а тут так еще больше текста:
<div style="font-size:40px;width:300px;height:45px;overflow:hidden;border:1px solid #000">
Такой вот тут у нас длинный-предлинный текст попался, чтож теперь поделаешь. Сокращать надо бы, но хочется, понимашь, хитрого дизайнерского хода.............................................................................
</div>
<script type="text/javascript">
var div = document.getElementsByTagName('div'), i = div.length, f;
while(i--){
while(div[i].scrollHeight>parseInt(div[i].style.height)&&(f=parseInt(div[i].style.fontSize)-1)>0){
div[i].style.fontSize = f+'px';
}
}
</script>
Цитата:
|
Цитата:
Цитата:
|
если бы топикстартеры знали, что им нужно, они бы не ходили на форум ;)
|
спасибо большое за ответы.товарищ Aetae, абсолютно верно меня понял.Однако у меня возникли некоторые трудности:
<style>
#menu_bg ul li a{
background-image:url(images/menu_punkt.png);
background-position:top;
background-repeat:no-repeat;
height: 45px;
color: #65b2b6;
display: block;
text-decoration:none;
width: 184px;
text-align:center;
line-height:45px;
cursor:pointer;
}
#menu_bg ul li a:hover{
background-image:url(images/menu_punkt.png);
background-position:bottom;
width: 184px;
height:45px;
}
#menu_bg ul li ul{
list-style:none;
width: 100%;
display: none;
margin: 0 auto;
padding: 0;
}
#menu_bg ul li ul li a{
background-image:none;
height: 34px;
color: #65b2b6;
display: block;
margin: 0 auto;
border-left: 1px solid #cfcfa9;
border-right: 1px solid #cfcfa9;
background-color: #f2f4d3;
text-decoration:none;
font-size:14px;
overflow:hidden;
width: 160px;
text-align:center;
line-height:34px;
}
#menu_bg ul li ul li a:hover{
background-image:url(images/menu_onhover.png);
width: 164px;
height: 34px;
font-size: 16px;
}
</style>
<script type='text/javascript'>
divAccor = document.getElementById('menu_bg');
getLi = divAccor.getElementsByClassName('underLi');
for(i=0;i<getLi.length;i++){
var menuA=getLi.item(i).getElementsByTagName('a'),f;
var height=parseInt(34); //высота блока, если она едина, то лучше задать просто вручную цифрой
while(menuA.scrollHeight>height&&(f=parseInt(menuA.style.fontSize)-1)>0)menuA.style.fontSize=f+'px'; //пока реальныя высота больше назначенной (и font-size>0 - мало ли=) ) уменьшаем размер шрифта на 1px;
}
function menuAccordion() {
var lis = new Array();
var ulInLi = new Array();
divAccor = document.getElementById('menu_bg');
getLi = divAccor.getElementsByTagName('li');
n = 0;
k = 0;
for(i=0;i<getLi.length;i++){
ulObj=getLi.item(i).getElementsByTagName('ul');
if(ulObj.length > 0){
lis[n]=getLi.item(i);
n++;
}
}
for(i=0;i<lis.length;i++){
lis[i].onclick = function() {
for(j=0;j<lis.length;j++){
if(lis[j].getElementsByTagName('ul').item(0).style.display != this){
lis[j].getElementsByTagName('ul').item(0).style.display = 'none';
}
}
ulObj = this.getElementsByTagName('ul').item(0);
if(ulObj.style.display == 'block'){
ulObj.style.display = 'none';
} else {
ulObj.style.display = 'block';
}
mainResize();
}
}
}
</script>
<div id='menu_bg'>
<li><a href='index.html'>Главная</a></li>
<li><a href='about.html'>О Нас</a></li>
<li><a href='javascript: return false'>Услуги</a>
<ul>
<li class="underLi"><a href='credit.html'>Кредиты</a></li>
<li class="underLi"><a href='deposit.html'>Депозиты</a></li>
<li class="underLi"><a href='card.html'>Карточки</a></li>
</ul>
</li>
<li><a href='javascript: return false'>Интернет-Банк</a>
<ul>
<li class="underLi"><a href='calcul.html'>Депозитный Калькулятор</a></li>
<li class="underLi"><a href='klient_bank.html'>Клиент-Банк</a></li>
</ul>
</li>
<li><a href='filia.html'>Филиалы</a></li>
<li><a href='partners.html'>Наши Партнёры</a></li>
</ul>
</div>
Вообщем у меня при преминении кода который мне дал Aetae смещаються стили.Li первого уровня вообще без стиля,а вот Li второго уровня почему-то получают стиль первого уровня. |
element.style.height = 'auto'
|
| Часовой пояс GMT +3, время: 12:07. |