Слишком длинный текст внутри элемента HTML

Question

Итак, мои вопросы похожи на это:

обрезать текст слишком долго внутри div

Чего я не хочу делать, так это жестко покончить сtext (обрезка любого переполнения текста).

Желаемый результат не будет включать эллипсы (...), но будет "исчезать".Поэтому, если бы у меня было что-то вроде:

<div class="text">This is the really long area of text that I want to chop</div>

, тогда, где бы я ни решил, скажем, на полпути в ожидании ... n будет наполовину блеклым, а t будет почти полностью блеклым.Конечно, позиционирование является случайным и может выпасть примерно на 3 или 4 буквы ...

Вот приемлемые решения в порядке предпочтения.

1. Можно ли затемнить текст с помощью cssв одиночку?
2. Если это невозможно, используя другой элемент в файле div.text, могу ли я выполнить то, что хочу (может исчезнуть непрозрачность?).
3. Сделать это с помощью jQuery?(тьфу ... не желательно)

Answer 1

Ваше решение 2. действительно возможно.Вам просто нужно использовать абсолютно позиционированный элемент с линейным градиентным фоном от белого до прозрачного.

Нет необходимости в изображении.

Вы можете взглянуть на http://css -tricks.com / текст-нарастающее чтение более /

Answer 2

Предполагая, что фон вашей страницы белый: создайте gif с прозрачным на белый (слева направо). Наложите это на правой стороне div. Ваш текст будет казаться белым.

Это похоже на то, как создаются "тени".

Отредактировано, чтобы добавить:

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

1. Нет, текст не может исчезнуть только с помощью CSS, если вы не сделаете это посимвольно; но это практически невозможно контролировать в разных браузерах и разрешениях экрана.

2. Непрозрачность не исчезает.

3. Я не знаю об объекте jQuery, который делает это, но я не использовал его много.