넓이에 맞게 자동으로 글자 자르기

넓이에 맞게 자동으로 글자 자르기

넓이에 맞게 글자를 잘르고 뒤에 "..."으로 표시됩니다.
긴 글일 경우 테이블이 깨지는 경우 사용하면 좋습니다.

예를 들어 넓이 200px인 DIV에
" [YesYo] 예스요닷컴 예스요닷컴예스요닷컴 " 라고 출력하면
" [YesYo] 예스요닷컴 예... " 같이 나타 납니다.

첨부파일을 확인 하십시오.

<STYLE type=text/css media=all>
.textcut {
	VERTICAL-ALIGN: top; OVERFLOW: hidden; LINE-HEIGHT: 120%; HEIGHT: 1.2em; TEXT-OVERFLOW: ellipsis; o-text-overflow: ellipsis
}
.textcut INS {
	DISPLAY: block; FLOAT: right; TEXT-DECORATION: none
}
</STYLE>
<SCRIPT src="textcut.js" type=text/javascript charset=euc-kr></SCRIPT>
<SCRIPT type=text/javascript charset=euc-kr>
function addEvent(target, en, func)
{
	if (window.addEventListener) 
	{
		if ((target == window) && (en.toLowerCase() == "load") && !window.opera && !(!document.all && document.childNodes && !navigator.taintEnabled))
			document.addEventListener("DOMContentLoaded", func, false);
		else
	        target.addEventListener(en, func, false);
    }
    else if (target.attachEvent) 
	{
		if ((target == window) && (en.toLowerCase() == "load"))
	    	document.attachEvent("onreadystatechange", function(e) { if (document.readyState == "complete") func(); });
		else
	        target.attachEvent("on"+en, func);
    }
	else 
	{
        var __func = eval("target.on"+en);

        eval("target.on"+en) = function() 
		{
            func();
            __func();
        }
    }
};
String.prototype.trim = function()
{
	return this.replace(/(^\s*)|(\s*$)/g, "");
};
function docEllipsisLoad()
{
	var tc = new textcut(); 
	tc.setEllipsis();
}
addEvent(window, "load", docEllipsisLoad);
</SCRIPT>
<DIV style="width:200px"><DIV class=textcut>
	<SPAN style="color:red">[YesYo]</SPAN> <SPAN style="color:blue">예스요닷컴 예스요닷컴예스요닷컴</SPAN> 
</DIV></DIV>