다음은 질문 형식을 유지하고 기사의 내용을 반영하는 몇 가지 제목 옵션입니다. 짧고 간결함: * 고정 크기 Div에서 여러 줄 텍스트에 대한 줄임표를 만드는 방법은 무엇입니까? * 텍스트 오베

고정 너비 및 높이에 대한 타원 텍스트 오버플로

문제:

너비와 높이가 고정된 요소는 어려울 수 있습니다. jQuery 플러그인을 탐색했음에도 불구하고 적합한 솔루션을 찾기가 어려웠습니다.

해결책:

jQuery를 활용하면 지정된 텍스트 내에 들어갈 때까지 텍스트에서 마지막 단어를 반복적으로 제거하여 원하는 효과를 얻을 수 있습니다. 키. 코드 조각은 다음과 같습니다.

var $p = $('#fos p');
var divh = $('#fos').height();
while ($p.outerHeight() > divh) {
    $p.text(function (index, text) {
        return text.replace(/\W*\s(\S)*$/, '...');
    });
}
이 스크립트는 텍스트가 
 내에 들어갈 때까지 텍스트의 마지막 단어를 반복적으로 줄임표(...)로 바꿉니다. JavaScript가 비활성화된 경우에도 텍스트는 줄임표 없이 올바르게 표시됩니다.

성능을 최적화하려면 이 클라이언트측 잘림과 서버측 잘림을 결합하여 오버헤드를 줄이는 것이 좋습니다.
 실제 예제는 이 jsFiddle 데모를 확인해 보세요.
위 내용은 다음은 질문 형식을 유지하고 기사의 내용을 반영하는 몇 가지 제목 옵션입니다.

짧고 간결함:

* 고정 크기 Div에서 여러 줄 텍스트에 대한 줄임표를 만드는 방법은 무엇입니까?
* 텍스트 오베의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
JavaScript jquery for format this overflow word
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.