世界美景50最 >>
<< 养眼
解决scrollbar自动…

Author Zhou Renjian Create@ 2004-02-22 20:48
whizz Note icon
解决scrollbar自动出现和消失的script代码:
<html>
<body 
    onload="editor.focus();"
    style="margin:0px;padding:0px;border:0px;overflow:hidden;"
>
<script>
var ScrollBarWidth = 16;
var ScrollBarHeight = 16;
function isXOverflow(obj) {
    if (obj.scrollHeight + ScrollBarHeight <= document.body.clientHeight) {
        // vertical scrollbar will never appear.
        if (obj.scrollWidth <= document.body.clientWidth) {
            return "hidden";
        } else {
            return "scroll";
        }
    } else {
        if (obj.scrollHeight <= document.body.clientHeight
                && obj.scrollWidth <= document.body.clientWidth
        ) {
            return "hidden";
            //vertical scrollbar won't appear neither
        } else {
            if (obj.scrollHeight + ScrollBarHeight > document.body.clientHeight
                    && obj.scrollWidth + ScrollBarWidth > document.body.clientWidth
            ) {
                return "scroll";
                // vertical scrollbar will also appear
            } else {
                // only horizontal scrollbar may appear
                if (obj.scrollWidth <= document.body.clientWidth) {
                    return "hidden";
                } else {
                    return "scroll";
                }
            }
        }
    }
}
function isYOverflow(obj) {
    if (obj.scrollWidth + ScrollBarWidth <= document.body.clientWidth) {
        // horizontal scrollbar will never appear.
        if (obj.scrollHeight <= document.body.clientHeight) {
            return "hidden";
        } else {
            return "scroll";
        }
    } else {
        if (obj.scrollHeight <= document.body.clientHeight
                && obj.scrollWidth <= document.body.clientWidth
        ) {
            return "hidden";
            //horizontal scrollbar won't appear neither
        } else {
            if (obj.scrollHeight + ScrollBarHeight > document.body.clientHeight
                    && obj.scrollWidth + ScrollBarWidth > document.body.clientWidth
            ) {
                return "scroll";
                // horizontal scrollbar will also appear
            } else {
                // only vertical scrollbar may appear
                if (obj.scrollHeight <= document.body.clientHeight) {
                    return "hidden";
                } else {
                    return "scroll";
                }
            }
        }
    }
}
</script>
    <div 
        id="editor" 
        style="
            width:100%;
            height:100%;
            padding:5px;
            font-size:14px;
            font-family:Arial;
            height:expression(document.body.clientHeight);
            overflow-y:expression(isYOverflow(this));
            width:expression(document.body.clientWidth);
            overflow-x:expression(isXOverflow(this));
        " 
        contenteditable="true"
    ></div>
</body>
</html>
本记录所在类别:
本记录相关记录: