Media Log

자바스크립트로 한글문자 길이체크하기 

/** 한글을 2byte로 인식하여 length 체크 */
function getByteLength( data ) {
    var len = 0;
    var str = data.substring(0);

    if ( str == null ) return 0;

    for(var i=0; i < str.length; i++) {
        var ch = escape(str.charAt(i));

        if( ch.length == 1 ) len++;
        else if( ch.indexOf("%u") != -1 )  len += 2;//Db가 한글을 3byte로 인식하여 2->3
        else if( ch.indexOf("%") != -1 ) len += ch.length/3;
    }

    return len;
}

일정한 길이를 넘으면 자동으로 말줌임표로 대체

<div style="width:275px;overflow: hidden; text-overflow: ellipsis;"><nobr>내용~~~~~~~</div>

가로사이즈 반드시 정해줘야 한다.
이미지버튼 텍스트와 줄맞추기
이미지 버튼을 그냥 텍스트와 같은 줄에 사용하면 이미지가 위로 올라가던지 밑으로  내려가던지 줄맞추기가 쉽지않다.

이럴때 스타일 속성중에 vertical-align:text-bottom요걸 사용하면 된다.
웹페이지 이동 부드럽게 ( 플래쉬 같은 효과 )

<meta http-equiv="page-enter" content="blendtrans(duration=0.2)" charset=euc-kr">
<meta http-equiv="page-exit" content="blendtrans(duration=0.2)" charset=euc-kr">

페이지 로딩시 페이지 이동시 효과를 줄 수있다.

스크롤을 따라 움직이는 레이어(div,span)

어떤 분이 올려논 소스를 조금 손 봤다.
일단 익스플로러에서만 작동을 한다.


<script type="text/javascript">
    markRefresh = 10; // 리프레쉬 시간(밀리세컨즈)
    var wMark;

    function setVals()
    {        
       //해당 div요소를 불러온다.
        wMark = document.getElementById?document.getElementById("아이디")
        :document.all?document.all["아이디"]:document.layers?document.divscrollphoto:null;
        if (wMark.style) wMark=wMark.style;    
    }

    function wRefresh()
    {
        if(document.body.scrollTop > 366) //스크롤바가 일정한 위치까지 내려간후에 작동한다.
        {
            wMark.left = (document.body.clientWidth/2) - 480; //화면크기가 바뀌어도 위치가 고정되도록 x축위치를 잡는다.
            wMark.top = document.body.scrollTop;
        }
        else
        {           
            wMark.top = 369;   //스크롤위치가 366이전까지는 레이어위치를 369에 고정  
            wMark.left = (document.body.clientWidth/2) - 480;
        }       
    }

    function markMe()
    {
        setVals();
        window.onresize=setVals;
        markID = setInterval ("wRefresh()",markRefresh);
    }
    window.onload=markMe;

    </script>

<div id="아이디">스크롤 되는 레이어</div>