add jquery.linscroll new function (js css 滚动条 ie6 ie7 ff )

山高月小

usage:

$('.scrollContent').setScrollNoArrow({img:'_common/img/scrollbar/scroll_bar.jpg',width:8},
{img:'_common/img/scrollbar/scroll_btn.jpg',height:16}
      );


<script>
/*
* Adding by Jerome Xie
* Supporting DOCTYPE Declaration
*/

jQuery.fn.setScrollNoArrow = function(_scroll, _scroll_bar){
    this.each(function(){
        
        var _bar_margin = 0;
var _bar_margin_str = '0px';
        
        //create scroll dom
        var _scroll_control = jQuery('<div class="scroll_zone">').width(_scroll.width).css({'position':'absolute','float':'none','margin':'0px','padding':'0px'}).css('background','url('+_scroll.img+')');
var _scroll_control_bar =  jQuery('<img class="scroll_bar">').attr('src',_scroll_bar.img).width(_scroll.width).css({'z-index':'1500','position':'absolute','float':'none','margin':'0px','padding':'0px','height':_scroll_bar.height+'px'}).css('top',_bar_margin_str);
        
        
        _scroll_control.append(_scroll_control_bar);
        
        var _oheight = jQuery(this).height();
        var _owidth = jQuery(this).width();
        var _ocontent = jQuery(this).html();
        
        if(jQuery(this).attr('scrollHeight')<=_oheight) return;
        
        var _content_zone = jQuery('<div>').html(_ocontent).css({ 'position':'relative','width':(_owidth-10)+'px','height':'auto','overflow':'visible','float':'none','left':'0px','top':'0px','margin':'0px','padding':'0px','white-space': 'normal'});
        
        jQuery(this).css({'overflow':'hidden'});
        jQuery(this).empty().append(_content_zone).css({'position':'relative'}).append(_scroll_control.css({'left':(_owidth-_scroll.width)+'px','top':'0px','height':_oheight+'px','margin':'0px','padding':'0px'}));

        //register drag event
        jQuery(this).find('.scroll_bar')
        .mousedown(
            function(){
                jQuery(document).mousemove(
                    function(e){
                      var _content = _content_zone.get(0);   

                      var lastProgress = (_scroll_control_bar.attr('progress') != undefined)? _scroll_control_bar.attr('progress') : 0 ;

                      _scroll_control_bar.attr('progress',e.pageY);

  var _scroll_control_bar_position = _scroll_control_bar.position();
  
  var nowProgress = _scroll_control_bar_position.top;   

                      nowProgress  += e.pageY-lastProgress;

  var _content_top = ((_content.offsetHeight - _oheight)/(_oheight -_scroll_bar.height))*nowProgress

  _content.style.top= -_content_top + "px";


  if(nowProgress<(_bar_margin) || nowProgress > (_oheight-(_scroll_bar.height+_bar_margin))){
  return false;
  }
                      try{_scroll_control_bar.css('top',nowProgress+'px');}catch(e){}
return false;
                    }
                );
                return false;
            }
        )
        .mouseout(
            function(){
                jQuery(document).mouseup(
                    function(){
                        jQuery(document).unbind('mousemove');
                     }
                )
            }
        )

        
    });
}

</script>

更多的请查考(感谢：cuikai)：

http://www.aa25.cn/css_example/794.shtml