2013-04-09 3 views
2

매우 긴 텍스트 값을 자르려면 div에 text-overflow: ellipsis을 사용하고 있습니다. 기본적으로 URL에 공백이 없으므로 div의 너비를 늘리는 오버플로를 방지해야합니다. 내가 뭘해야 표시 않습니다 :처음에 문자열 자름

http://www.somewebsite.org/over-the-counter/drugs/medone.html 
http://www.somewebsite.org/over-the-counter/drugs/medtwo.html 
http://www.somewebsite.org/over-the-counter/drugs/medthree.html 

같이

...he-counter/drugs/medone.html 
...he-counter/drugs/medtwo.html 
...-counter/drugs/medthree.html 

이에서 - 모든 HTML/CSS에서 행할 수 있습니까? 또는 jQuery/PHP 내 유일한 해결 무엇입니까?

말하자면 마우스 오버시 전체 문자열이 툴팁으로 표시됩니다. 툴팁에서

+0

php [substr()] (http://php.net/manual/en/function.substr.php)는 –

+0

을 염두에두고 있습니다. javascript 또는 php가 도움이 될 것입니다. (선호 php) –

+0

http://stackoverflow.com/questions/9793473/text-overflow-ellipsis-on-left-side – Andreas

답변

0

$short = '...'.substr($url, -20);

$url

+0

오른쪽. PHP에서 어떻게 사용되는지 알고 있습니다. CSS 사용에 대한 좋은 점은 잘림이 동적이라는 것입니다. 예를 들어'O'는'i'보다 많은 픽셀 공간을 사용합니다. CSS text-overflow auto는 div 폭에 따라 줄임표를 계산하여 넣습니다. –

+2

CSS 또는 기타 클라이언트 측에 대한 나쁜 점은 신뢰할 수 없다는 것입니다. 일부 사용자는 서버 측에서도 지원하지 않는 브라우저를 가지고 있습니다. –

+0

javascript에서는별로 다르지 않습니다 ... 'short =' ... + (url.substr (-20)); ' – Mottie

0

당신은 컨테이너 (오른쪽에서 왼쪽으로) rtl로 설정 순수 CSS 및 direction 속성이 수행 할 수 있습니다 보여줍니다.