基于Jquery的textarea滚动条插件(原创)

时间:2014-03-19 16:44:51   收藏:0   阅读:511

之前项目中自己写的滚动条插件。先前太忙没有好好整理。现在项目间歇期拿出来整理后贴出来

 

Demo Here

 

css 我是把mCustomScrollbar 的UI 扣下来的。 这里我要介绍下这个插件不错。可以满足日常使用

 

js 没有啥困难的demo中都有。

 

其中有一些关键方法我举出来

1:addStyle

bubuko.com,布布扣
var addStyle = function($dom,addStyleObject) {
            var sStyle      = $dom.attr(‘style‘),
                aStyle      = sStyle ? sStyle.split(‘;‘) : [],
                oStyle      = {},
                aFinalstyle = [];
            for (var i = 0; i < aStyle.length; i++) {
                var sPerStyle = aStyle[i];
                if(sPerStyle) {
                    var sAttr = $.trim(sPerStyle.split(‘:‘)[0]);
                    if(typeof(addStyleObject[sAttr]) != ‘undefined‘) {
                        oStyle[sAttr] = addStyleObject[sAttr];
                    }
                }
            }
            var oNewStyle = $.extend(addStyleObject,oStyle);
            for (var i in oNewStyle) {
                if (oNewStyle.hasOwnProperty(i)) {
                    aFinalstyle.push(i+‘:‘+oNewStyle[i]+‘;‘);
                }
            }
            $dom.attr(‘style‘,aFinalstyle.join(‘‘));
        };
bubuko.com,布布扣

jquery 中我们不要使用$(dom).css({width:‘100‘,‘height‘:‘200‘}); 这样会导致多次重绘。$(dom).attr(‘style‘,‘width:100px;height:200px;‘});这样更好

 

其他的就是计算滚动条的height与top值,以及textarea的scrollHeight具体代码。大家可以看代码中。相对简单。我就不举例了

基于Jquery的textarea滚动条插件(原创),布布扣,bubuko.com

原文:http://www.cnblogs.com/blueSkys/p/3611557.html

评论(0
© 2014 bubuko.com 版权所有 - 联系我们:wmxa8@hotmail.com
打开技术之扣,分享程序人生!