VPF::Медленно обрезается текст - Форум программистов

sashgera

Дата 10.6.2016, 16:43 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 32
Регистрация: 23.3.2014

Репутация: нет
Всего: нет

Здравствуйте
Есть JS, который в цикле обрезает текст. Текст обрезается и с этим проблем нет. Но на сайте, как мне кажется, текст обрезается медленно.
Посмотрите, плиз, код JS на предмет ошибок

Код


<style type="text/css">
.wrapper {width:190px; height: 50px; border: 1px solid black;}
.d2 {float:left; padding: 0 10px; background-color:#0F0;}
.d3 {float:left; padding: 0 10px; background-color:#FF0;}
</style>
 
<div class="wrapper"> 
  <div class="d1">
     <div class="d2">>>>></div>
     <div class="d3">Этот текст больше ширины дива wrapper и поэтому его нужно обрезать.</div>
  </div>
</div>

Код


<script>
$(document).ready(function(){
    var nameTrim = $(".d3").outerWidth() - 1;
    for (; $(".d3").outerWidth() >= ($(".d1").outerWidth() - $(".d2").outerWidth()); --nameTrim) {
        $(".d3").text('...' + $(".d3").text().slice(-nameTrim));
    }
});    
</script>

YahоО

Дата 27.6.2016, 22:54 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 206
Регистрация: 11.6.2015

Репутация: 1
Всего: 1

Почему бы не так:

Код


<style>
.wrapper{
 display: inline-block;
 border: 1px solid black;
 font-family: 'Times New Roman', Times, serif;
 font-size: 250%;
}
.d2 {float:left; padding: 0 10px; background-color:#0F0;}
.d3 {float:left; padding: 0 10px; background-color:#FF0;}
</style>
<div class="wrapper">
  <div class="d1">
   <div class="d2">abcd</div>
   <div class="d3">тотd3 текст больше ширины дива wrapper и поэтому его нужно обрезать.</div>
  </div>
</div>
<script>
$(document).ready(function(){
 while($(".d3").outerWidth()>$(".d2").outerWidth()){$(".d3").text($(".d3").text().substr(0,$(".d3").text().length-1))}
});
</script>

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »