Правила     Закладки     Карма    Календарь    Журналы    Помощь    Поиск    PDA    Чат   
        СМС-ки
   
Пейджер выключен!
 
Фильтр авторов:    показать 
  скрыть
  Ответ в темуСоздание новой темыСоздание опроса

> Обрезать текст по ширине дива
rodiony4  
 ۩  [x] Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 11
Пользователь №: 43033
На форуме: 6 месяцев, 8 дней
Карма:




Здравствуйте. Есть условие, если ширина двух блоков (.d2 и .d3) будет больше ширины блока .d1 - тогда нужно обрезать текст в блоке .d3
Но обрезать не просто на какое-то количество символов, а на столько, чтобы текст уместился по всей ширине этого блока.
/без CSS, только JS/

<style type="text/css">
.wrapper {width:190px;}
.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">Этот текст, увеличил ширину блока и блок съехал на другую строку.</div>
</div>
</div>



<script>
$(document).ready(function(){
var d1 = $('.d1').outerWidth(),
d2 = $('.d2').outerWidth(),
d3 = $('.d3').outerWidth(),
d23 = (d2 + d3);
if(d1 <= d23) {
// как обрезать текст в начале строки в .d3 на столько, чтобы он уместился по всей ширине этого блока и не съезжал на другую строку?
}
}
);
</
script>


Это сообщение отредактировал rodiony4 - 2.06.2016 - 23:05
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Игорь_Vasinsky  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Лысый и злой
******

Профиль
Журнал
Группа: ★ЛжеЭксперт★
Завсегдатай форума
Сообщений: 25994
Пользователь №: 21350
На форуме: 6 лет, 8 месяцев, 27 дней
Карма: 725

Не курю:
1 год, 2 месяца, 13 дней




--------------------
Халявные ответы кончились.
Если нужен готовый код - готовьтесь заплатить.
Райкин тоже был артист

Возле дома был сарай
А когда всё хорошо
Можно просто покурить

user posted image
http://ufa102.xyz/
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
rodiony4  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 11
Пользователь №: 43033
На форуме: 6 месяцев, 8 дней
Карма:




http://javascript.ru/string/substring
Игорь_Vasinsky, здесь написано как обрезать текст на определенное количество символов
А мне нужно обрезать не просто на какое-то количество символов, а на столько, чтобы текст уместился по всей ширине этого блока. Ширина блока будет зависеть от длинны текста.
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Guest  
Дата
Цитировать сообщение


Гость пожелал остаться неизвестным

Unregistered









А просто ccs'ом это не решается?
https://jsfiddle.net/sh2a6gjr/
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
rodiony4  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 11
Пользователь №: 43033
На форуме: 6 месяцев, 8 дней
Карма:




Цитата (rodiony4 @ 2.06.2016 - 22:41)

/без CSS, только JS/

и в вашем примере див ушел на другую строку
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Kusss  
Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Здесь живет
******

Профиль
Группа: Форумчанин
Завсегдатай форума
Сообщений: 1357
Пользователь №: 28976
На форуме: 5 лет, 4 месяца, 12 дней
Карма: 77




PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Guest  
Дата
Цитировать сообщение


Гость пожелал остаться неизвестным

Unregistered









Ну так правильные размеры прописать нужно.
Но если только JS – то можно так: https://jsfiddle.net/sh2a6gjr/3/
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
rodiony4  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 11
Пользователь №: 43033
На форуме: 6 месяцев, 8 дней
Карма:




Guest, да, так, спасибо, но я не могу изменять/добавлять стили css (если в коде убираю padding = 20, "12pt arial" то js не правильно выполняется). И как в вашем примере обрезать текст с начала стоки, а также добавить троеточие

Это сообщение отредактировал rodiony4 - 3.06.2016 - 14:15
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Guest  
Дата
Цитировать сообщение


Гость пожелал остаться неизвестным

Unregistered









    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
rodiony4  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 11
Пользователь №: 43033
На форуме: 6 месяцев, 8 дней
Карма:




Guest, OK, но я не могу изменять/добавлять стили css (если в вашем коде убираю padding = 20, "12pt arial" то js не правильно выполняется).
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
Guest  
Дата
Цитировать сообщение


Гость пожелал остаться неизвестным

Unregistered









Там не нужно ничего добавлять.
Вместо "12pt arial" пропиши свой фонт. Такой, каким у тебя рисуется текст в .d3.
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
rodiony4  
 ۩  Дата
Цитировать сообщение

Пользователя сейчас нет на форуме



Новичок
*

Профиль
Группа: Пользователь
Сообщений: 11
Пользователь №: 43033
На форуме: 6 месяцев, 8 дней
Карма:




Guest, понял, спасибо!
PMПисьмо на e-mail пользователю
    0   Для быстрого поиска похожих сообщений выделите 1-2 слова в тексте и нажмите сюда Для быстрой цитаты из этого сообщения выделите текст и нажмите сюда
  Быстрый ответ
Информация о Госте
Введите Ваше имя
Кнопки кодов
Для вставки цитаты, выделите нужный текст и
НАЖМИТЕ СЮДА
Введите сообщение
Смайлики
:huh:  :o  ;) 
:P  :D  :lol: 
B)  :rolleyes:  <_< 
:)  :angry:  :( 
:unsure:  :blink:  :ph34r: 
     
Показать всё

Опции сообщения  Включить смайлики?
 Включить подпись?
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:

Опции темы Ответ в темуСоздание новой темыСоздание опроса