jquery 如何在slimScroll中设置min-height和max-height?

ffdz8vbo  于 2023-08-04  发布在  jQuery
关注(0)|答案(4)|浏览(144)

如何在slimScroll插件中添加min-height和max-height?我在文本区应用此插件,文本区最大高度达到它需要滚动,文本区默认最小高度120 px和最大高度200 px

<script>
     $(".editTextarea").slimScroll({
                    color: '#e5e5e5',
                    position: 'right',
                    alwaysVisible: false
     });
</script>

字符串

voase2hg

voase2hg1#

如果你查看源代码,你可以看到默认选项

var defaults = {
    //Add these lines in your plugin source code
      minHeight:'auto',
      minWidth:'auto'

    width : 'auto',

    height : '250px',

    size : '7px',

    color: '#000',

    position : 'right',

    distance : '1px',

    start : 'top',

    opacity : .4,

    alwaysVisible : false,

    disableFadeOut : false,

    railVisible : false,

    railColor : '#333',

    railOpacity : .2,

    railDraggable : true,

    railClass : 'slimScrollRail',

    barClass : 'slimScrollBar',

    wrapperClass : 'slimScrollDiv',

    allowPageScroll : false,

    wheelStep : 20,

    touchScrollStep : 200,

    borderRadius: '7px',

    railBorderRadius : '7px'
  };

字符串
我认为你不能添加min-height和min-width通过插件有两个选项

  • 研究源代码,然后添加额外的样式属性
  • 或者/尝试使用CSS

在源代码行中添加注解行(164和176)var wrapper = $(divS).addClass(o.wrapperClass).css({ position:'relative',溢出:'hidden',width:o.宽度、高度:〇.height /* min-heigth:〇.minHeight,min-width:〇.minWidth */ });

// update style for the div
        me.css({
          overflow: 'hidden',
          width: o.width,
          height: o.height,
          /*
          min-heigth:o.minHeight,
          min-width:o.minWidth
          */
        });

3j86kqsm

3j86kqsm2#

你的问题很难理解,但我认为你所说的是让textarea只在超过你想要设置的max-height时才可滚动?默认情况下不能这样做,但可以更改一些源代码。

height: o.height and change to 'max-height': o.height (line: 156 and 163)

字符串
在这个线程中更详细地描述:https://github.com/rochal/jQuery-slimScroll/issues/70

wsewodh2

wsewodh23#

设置height: auto并设置父最小高度

<div class='parent' style='min-height:400px;'>
   <div class='scroll'>
     //content
   </div>
</div>

个字符

exdqitrt

exdqitrt4#

这对我来说是个陷阱。

$("xxx").slimScroll({
  size: '8px',
  width: '100%',
  height: 'fit-content',
  color: '#ff4800',
  allowPageScroll: true,
  alwaysVisible: false,
  railVisible: true,
  // scroll amount applied to each mouse wheel step
  wheelStep: 20,
  // scroll amount applied when user is using gestures
  touchScrollStep: 200,
  // distance in pixels between the side edge and the scrollbar
  //distance: '10px',
}).css("max-height", "50vh").parent().css("max-height", "50vh");

字符串

相关问题