Перенос текста

[fAmOus]

Всем привет!
Помогите с реализацией идеи..
Вообщем есть block1 с текстом и block2 без текста, если в block1 больше 50 символов остальные символы которые не вместились переходили в block2.
Заранее спасибо.

[lord2kim]

fAmOus, самое простое, но наверняка есть решение получше

window.onload = function () {
  var block1 = document.getElementById("block1"),
       block2 = document.getElementById("block2"),
       text = block1.innerHTML;
  if (text.length > 50) {
    block1.innerHTML = text.substr(0, 49);
    block2.innerHTML = text.substr(50, text.length);
  }
}

[fAmOus]

lord2kim,
Спасибо, был один баг не переносил 1 букву "исправил".
А можно ли сделать чтобы переносил слова?
Слово не вместилось и переносит.. как-то так

[Aetae]

window.onload = function () {
  var block1 = document.getElementById("block1"),
       block2 = document.getElementById("block2"),
       text = block1.innerHTML,
       pos = text.lastIndexOf(' ', 51);
  if (text.length > 50) {
    block1.innerHTML = text.substring(0,  pos);
    block2.innerHTML = text.substring(pos+1);
  }
}

[bes]

https://developer.mozilla.org/en-US/...ay/lastIndexOf,
здесь пишут, что поддержка lastIndexOf, начиная с IE9, хотя проверил, работает и в 7, 8 , по ходу блажанули

[bes]

ха-ха, тупнул, сразу на таблицу глянул, на большее не хватило

[fAmOus]

Всё работает замечательно только я не учел один нюанс
Вообщем блоков с id "content-last-screams" много, нужно чтобы каждый "content-last-screams" переносил свои не влезающие слова в блок "content-last-screams-load".

Выглядит примерно так:

<div id="content-last-screams1" class="content-last-screams"> - Вообщем блоков с id "content-last-screams" много, нужно чтобы каждый "content-last-screams" переносил свои не влезающие слова в блок "content-last-screams-load".</div>
<div id="content-last-screams-load1" class="content-last-screams-load"></div>

<div id="content-last-screams2" class="content-last-screams"> - Вообщем есть block1 с текстом и block2 без текста, если в block1 больше 50 символов остальные символы которые не вместились переходили в block2.</div>
<div id="content-last-screams-load2" class="content-last-screams-load"></div>

<div id="content-last-screams3" class="content-last-screams"> - Спасибо, был один баг не переносил 1 букву "исправил".
А можно ли сделать чтобы переносил слова?
Слово не вместилось и переносит.. как-то так</div>
<div id="content-last-screams3" class="content-last-screams-load"></div>

[fAmOus]

Дзен-трансгуманист,
Отредактировал.. а если так?

[fAmOus]

Дзен-трансгуманист,
Благодарю

[bes]

<style>
.textBegin {
	color: green;
}
.textEnd {
	color: lightgreen;
}
</style>

<div class="textBegin">
 - Вообщем блоков с id "content-last-screams" много, нужно чтобы каждый "content-last-screams" переносил свои не влезающие слова в блок "content-last-screams-load".
 </div>
<div class="textEnd"></div>

<div class="textBegin">
 - Вообщем есть block1 с текстом и block2 без текста, если в block1 больше 50 символов остальные символы которые не вместились переходили в block2.
 </div>
<div class="textEnd"></div>

<div class="textBegin">
 - Спасибо, был один баг не переносил 1 букву "исправил".
А можно ли сделать чтобы переносил слова?
Слово не вместилось и переносит.. как-то так
</div>
<div class="textEnd"></div>

<script>
window.onload = function () {

	if (!document.getElementsByClassName) { 
		document.getElementsByClassName = function (nameOfClass) {
			var mas = []; 
			var elements = this.getElementsByTagName('*'); 
			var len = elements.length;
			for (var i = 0; i < len; i++) { 
				if (elements[i].className == nameOfClass) { 
					mas.push(elements[i]); 
				}
			} 
			return mas; 
		}
	}

	function setBreak(elem1, elem2) {
		var n = 50;
		var text = elem1.innerHTML;
		if (text.length > n) {
			var pos = text.lastIndexOf(' ', n + 1);
			elem1.innerHTML = text.substring(0,  pos);
			elem2.innerHTML = text.substring(pos + 1);
		}
	}

	var elems1 = document.getElementsByClassName('textBegin');
	var elems2 = document.getElementsByClassName('textEnd');
	var len = elems1.length;
  
	for (var i = 0; i < len; i++) {
		setBreak (elems1[i], elems2[i]);
	}
	
}
</script>

PS: или через querySelectorAll