Перенос по слогам

[Сергей Ракипов]

Я знаю что есть

    
hyphens: auto;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;

Но это работает только в мозиле и больше ни где.
Я нашел вот такую ссылку http://wiki.sawtech.ru/index.php/П�...aScript_JQuery но не понимаю работает это решении или просто я что то то делаю не то.

[Сергей Ракипов]

Там есть вот такое
Перенос по слогам JavaScript JQuery

$.fn.rusHyphenate = function () {
	var all = '[абвгдеёжзийклмнопрстуфхцчшщъыьэюя]',
		vowel = '[аеёиоуыэюя]',
		consonant = '[бвгджзклмнпрстфхцчшщ]',
		zn = '[йъь]',
		shy = '\xAD',
		hyp = [];

	hyp[0] = new RegExp('(' + zn + ')(' + all + all + ')', 'ig');
	hyp[1] = new RegExp('(' + vowel + ')(' + vowel + all + ')', 'ig');
	hyp[2] = new RegExp('(' + vowel + consonant + ')(' + consonant + vowel + ')', 'ig');
	hyp[3] = new RegExp('(' + consonant + vowel + ')(' + consonant + vowel + ')', 'ig');
	hyp[4] = new RegExp('(' + vowel + consonant + ')(' + consonant + consonant + vowel + ')', 'ig');
	hyp[5] = new RegExp('(' + vowel + consonant + consonant + ')(' + consonant + consonant + vowel + ')', 'ig');

	return this.each(function () {
		var text = $(this).html();

		for ( var i = 0; i <= 5; ++i ) {
			text = text.replace(hyp[i], '$1' + shy + '$2');
		}
		$(this).html(text);
	});
};

$(selector).rusHyphenate();

Вариант с обработкой длины слова
Чтобы переносы были только в длинных словах

$.fn.rusHyphenate = function ( options ) {
	options = $.extend({
		maxWordLength: 15, // максимальная длина слова
	}, options);

	var all       = '[абвгдеёжзийклмнопрстуфхцчшщъыьэюя]',
	    vowel     = '[аеёиоуыэюя]',
	    consonant = '[бвгджзклмнпрстфхцчшщ]',
	    zn        = '[йъь]',
	    shy       = '\xAD',
	    hyp       = [];

	hyp[0] = new RegExp('(' + zn + ')(' + all + all + ')', 'ig');
	hyp[1] = new RegExp('(' + vowel + ')(' + vowel + all + ')', 'ig');
	hyp[2] = new RegExp('(' + vowel + consonant + ')(' + consonant + vowel + ')', 'ig');
	hyp[3] = new RegExp('(' + consonant + vowel + ')(' + consonant + vowel + ')', 'ig');
	hyp[4] = new RegExp('(' + vowel + consonant + ')(' + consonant + consonant + vowel + ')', 'ig');
	hyp[5] = new RegExp('(' + vowel + consonant + consonant + ')(' + consonant + consonant + vowel + ')', 'ig');

	return this.each(function () {
		var text = $(this).html(),
		    res  = '';

		text = text.split(' ');

		text.forEach(function ( word, i ) {
			if( word.length > options.maxWordLength ) {
				for ( var i = 0; i <= 5; ++i ) {
					word = word.replace(hyp[i], '$1' + shy + '$2');
				}
			}


			res += word + ' '
		})

		$(this).html(res);
	});
};

$(selector).rusHyphenate({maxWordLength: 10});

[ksa]

Сергей Ракипов, если сможешь сам расставить тег <wbr> - сможешь переносить как захочешь...

[Сергей Ракипов]

ksa,
Ну там тире не будет и это очень много что бы все расставить, если только программа какая то есть, и как тире делать

[ksa]

Сергей Ракипов, какую задачу решаешь?
Что там за огромный текст, который нужно еще и по слогам переносить?

[Сергей Ракипов]

Да текста много, это вообще не вариант что бы расставлять переносы вы ручную тем более без тире.

[рони]

Сергей Ракипов,
есть плагины на эту тему, https://github.com/mnater/Hyphenopoly
https://www.npmjs.com/package/hyphen
но как с ними работать не знаю, нужен разбирающийся человек, там и там есть поддержка русского языка.

[voraa]

Зачем они вообще нужны? Если только очень узкая колонка.

[Сергей Ракипов]

voraa,
Так вот в этом и проблема вот как будет при узком разрешении экрана



https://ibb.co/VWP7QXw

[Сергей Ракипов]

рони,
Тоже не разобрался