웹솔루션개발 22년 노하우! 해피CGI의 모든것

ellipses는 한줄만 적용이 됩니다. 한줄 이상의 콘텐츠에서도 적용이되어 크로스 브라우징이 가능한 라이브러리 입니다. 링크를 통해서 사이트로 이동해보시면 여러가지 예제와 함께 파일다운로드를 제공하고 있습니다. 한줄이상의 컨텐츠를 Ellip한 모습 일반 텍스트로만 작성된 문서나, 마크업을 통해서 표현된 텍스트, 텍스트의 중간을 자를수도 있습니다. 기본적인 사용방법은 여느 jquery소스와 동일합니다. 헤드부분에 위와같이 스크립트를 불러온다음. 사용하기위한 각 각의 스크립트 그리고 작성글에 원하는 ID값을 붙여주시면 동작을하게 됩니다. 자세한 사용방법은 http://dotdotdot.frebsite.nl/ 에서 확인하실 수 있습니다.

ellipses는 한줄만 적용이 됩니다. 한줄 이상의 콘텐츠에서도 적용이되어 크로스 브라우징이 가능한 라이브러리 입니다. 링크를 통해서 사이트로 이동해보시면 여러가지 예제와 함께 파일다운로드를 제공하고 있습니다. 한줄이상의 컨텐츠를 Ellip한 모습 일반 텍스트로만 작성된 문서나, 마크업을 통해서 표현된 텍스트, 텍스트의 중간을 자를수도 있습니다. 기본적인 사용방법은 여느 jquery소스와 동일합니다. 헤드부분에 위와같이 스크립트를 불러온다음. 사용하기위한 각 각의 스크립트 그리고 작성글에 원하는 ID값을 붙여주시면 동작을하게 됩니다. 자세한 사용방법은 http://dotdotdot.frebsite.nl/ 에서 확인하실 수 있습니다.

위와같이 특정 소스내에 폰트 및 이미지등이 잘리더라도 ... 으로 표시되거나 모바일마다 변경되는 다양한 브라우저등에서 아주 효과좋은 리스트 화면을 구현할 수 있습니다. 방법은 아주 간단합니다. 먼저 css 상에서 ellipsis 효과를 줄 text-overflow:ellipsis 소스를 style 을 적용합니다. 주의하셔야 할 부분으론 word-break:break-all 을 사용하지 않으실경우 폰트영역의 소스를 문자열로 인식하지 않아 '...' 이란 문자열이 출력되지 않사오니 꼭 기입해주시기 바랍니다. 이후 반영할 리스트 형태의 템플릿 항목에 아래와 같이 반영합니다. 샘플예제는 table 영역에 적용된 예제로 어떠한 브라우저에서도 크로싱이 훌륭하게 반영되며, 소스도 비교적 간단하여 초보자들도 사용하시기..