Размер окна JQuery. изменить ограничение на количество символов в тексте

Привет ребята, Может ли кто-нибудь мне здесь немного помочь? Я пытаюсь использовать этот JQuery, чтобы ограничить некоторые текстовые символы в разных размерах окна:
http://jsfiddle.net/5SM9u/32/

Этот пример кода работает отлично. Но не на моем сайте:

 


<script src="[URL='https://lumtu.com/yti/a4ii4anNodHRwOi8vdGhlYnRjZHVkZS5jb20vanF1ZXJ5LTMuMi4xLm1pb1mL']http://thebtcdude.com/jquery-3.2.1.min.js[/URL]"></script>


<script type="text/javascript">


function checkWidth() {


if ($(window).width() < 700) {


$('#menu2').addClass('f-nav');


$("#menu2").each(function(i){


len=$(this).text().length;


if(len>30)


{


$(this).text($(this).text().substr(0,30)+'...');


}


})


} else{


$('#menu2').removeClass('f-nav');


$("#menu2").each(function(i){


$(this).text($(this).data('originalTxt'));


});


}


}


$("#menu2").each(function(){


$(this).data({originalTxt: $(this).text()});


});


$(window).resize(checkWidth);


</script>

Код (разметка): На первый взгляд кажется, что он работает нормально.

Появится зеленая полоса с полным текстом. При изменении размера окна полоса стала красной, а текст ограничен.

Здесь все хорошо. Проблема в том, что когда я возвращаюсь к исходному разрешению, полоса не меняет цвет с красного на зеленый, как в примере. Что я делаю не так? Код, который я использовал:

 [URL='https://lumtu.com/yti/bwbbwbS9odHRwOi8vdGhlYnRjZHVkZS5jSZk']http://thebtcdude.com/[/URL]

Код (разметка): Спасибо.

KaBoom взрывается в образе прославленного кролика-плейбоя по имени PoPSiCLe (~: Вот альтернативная смесь CSS, которая может стать хорошей заменой функции jQuery, которую вы пытаетесь интегрировать. jsfiddle.net/xs0m7gex/ С наилучшими пожеланиями, Зелёный рог джей м я е «Эта ветка отслеживается, просматривается, записывается и архивируется» — АНБ (я слежу за тобой)

Привет, Спасибо, что попытались мне помочь. Не работает нормально... Посмотрите пожалуйста, разрешение 1024: 720 Разрешение: Но когда я возвращаюсь к 1024, текст становится ограниченным и должен выглядеть так, как на первом скриншоте:

Хм... нет? Он не будет.

Во-первых, боты видят ТОЛЬКО источник.

Поэтому имеет смысл иметь весь текст в HTML.

Ботов не волнуют CSS или JS. Если пользователь хочет посмотреть HTML и не может понять, что он/она видит.

это действительно не то, что вас должно беспокоить. Это визуальное различие, основанное на разных физических характеристиках.

Следовательно, его следует изменить с помощью CSS.

Нет смысла делать это с помощью javascript — почему именно это лучше?

Я сомневаюсь в этом. Хотя да, вы можете добиться этого с помощью CSS, но в конечном итоге на экране будет одно, а в исходном коде — другое, что неправильно. Если вы хотите что-то изменить, измените это, а не прячется от глаз пользователей.

И... основанием для этого.

что именно? Все, что вы показываете пользователю, — это презентация, а это работа CSS.

То, что находится в исходном коде, совершенно не имеет значения для пользователей браузеров с графическим интерфейсом.

Для пользователей, которые не используют браузеры с графическим интерфейсом (например, программы чтения с экрана), представление его через CSS делает им доступным полный текст — обычно это то, что вам нужно.

Я не понимаю, насколько ваш ответ хотя бы отдаленно верен...

Я не знаю, что ты делаешь, но я уверен, что ты делаешь много работы зря.

Зачем вам сокращать текст для мобильных устройств? Как он собирается создать хороший UX и помочь кому-либо, если он понятия не имеет, что такое то или иное предложение? Во-вторых, вы использовали text-overflow: ellipsis; в той другой теме: https://forums.digitalpoint.com/threads/limit-text-length-using-css-problem.2810903/#post-19488742

просто поместите аналогичный CSS-код для этого примера между Скрытая информация :: Авторизуйтесь для просмотра »
(макс. ширина: 720 пикселей) {} вместо использования jquery.

Бедный ты. К сожалению. К исходный код Я имею в виду HTML, который, согласно вашему примеру, может также использоваться пользователями браузеров без графического интерфейса, такими как боты и тому подобное. Имея что-то в источник и отсутствие его во внешнем интерфейсе определенно запутает как системы, так и пользователей, если они когда-либо попытаются на него взглянуть.

qwikad, я хочу сократить текст для мобильных устройств, потому что у меня есть большие тексты, которые нарушают макет моего сайта.

Я попробовал CSS, но, к сожалению, и мой макет тоже сломался, и я не могу найти исправление, не сломав что-то еще, кроме текста.

Но здесь я очень близок к решению, мне просто нужно понять, почему URL-адрес примера кода работает нормально, а не на моем веб-сайте.

Есть идеи? Спасибо!