Question

我有一个div，为了让它变得更漂亮，我在该div上使用SlimScroll jQuery plugin

$('#scrollable').slimscroll({
   color: '#900',
   size: '8px',
   width: '300px',
   height: '500px'
});

现在有一段时间我希望这个div不再具有此属性（但是要使用浏览器默认滚动条）。如何删除slimscroll？

Answer 1

$("#scrollable").slimScroll({destroy: true});

Answer 2

我做了这个功能，在我的情况下效果很好

function destroySlimscroll(objectId) { 
   $("#"+objectId).parent().replaceWith($("#"+objectId)); 
}

Answer 3

我这样做了，它比我看到的任何其他解决方案都更好..

$(".slimScrollBar,.slimScrollRail").remove();
$(".slimScrollDiv").contents().unwrap();

Answer 4

尝试在其上调用destroy方法，希望它支持。

$('#scrollable').slimscroll("destroy");

您还可以删除插件应用的所有内联样式

$('#scrollable').attr('style', '');

Answer 5

我在一个大型SPA应用程序中遇到此问题。即使调用slimScroll的destroy方法，scroll也只是一直堆积在一起。

所以这是我的解决方案。

Fs=8000;
wavrecord(n,Fs) % records n samples at a sampling rate Fs
for i=1:8000
  if(abs(x(i))>t)
      y1(j)=x(i);
      j=j+1;
  end
end

此代码运行并销毁所有卷轴，然后控制器可以根据需要自由绑定卷轴。

Answer 6

没有一个答案对我有用，所以我想我会分享我的解决方案。

我在handleScroller()上加载了一个名为document.ready()的函数。当我在ul li上执行更新时，我再次调用handleScroller()函数，以便slimScrollDiv被销毁并重新重建。我也设置了ul容器的高度。它看起来运作得很好。以下是我的代码示例：

style.css中的CSS .scroller {height：182px;}

HTML / Bootsrap菜单

<ul class="nav navbar-nav pull-right">
   <!-- slimScroll notifications -->
   <li id="header_notification_bar"  class="hidden dropdown">
   <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
    <i class="fa fa-bell"></i>
        <span class="badge">
            6
        </span>
   </a>
   <ul id="notifications" class="dropdown-menu extended"></ul>
   </li>
<!--other menu items ... //-->
</ul>

<强> JS / jQuery的

$(document).ready(function(){
   handleScroller();
   VisitedHandler(); 
});

function VisitedHandler(){
   $("#notifs li").on("click",function(){

      $("#notifications").html('');     
      $('ul#notifs').html('');
      $("#notifications").append('<li><ul id="notifs" class="dropdown-menu-list scroller"></li>');
       var ul = $('#notifs');
           ul.append('<li id="general">New Announcement</li>')   
           ul.append('<li id="enhancements">New Page Enhancements</li>'); 

    handleScroller();

});
}

function handleScroller(){
  $("#notifs").slimscroll({destroy:true});
     var notes = $("#notifs");
     var height = notes.css("height");
     if($('#notifs .nws').size() < 5 && $('#notifs .nws').size() != 0)
        height = $('#notifs .nws').size() * 40 + 22;
     else      
        height = 182;
     //no Notifications
     if($('#notifs .nws').size() == 0)
        height = 0;
   $("#notifs").slimScroll({
    size: '10px',
    color: '#a1b2bd',
    railColor:'#272727',
    position: 'right',
    height: height,
    alwaysVisible: true,
    railVisible: true,
    disableFadeOut: true
   });
}

注意：有一个解决方案here将handleScroller()逻辑包裹在setInterval()附近。如果可能，我建议远离setInterval()。

Answer 7

启用slimscroll并禁用slimscroll $（＆＃39;＃滚动＆＃39）。slimscroll（＆＃34;破坏＆＃34）;

从div中删除slimscroll

7 个答案: