我正在为我的问题搜索解决方案,但我无法找到它。所以我下载了jQuery插件(mCustomScrollbar),一切都很好,没有一件事 - 我无法在测试页面中通过鼠标滚轮滚动。控制台很清楚,作者的例子很有用。我尝试在最新的Firefox和Chrome中运行我的代码,但代码无效。
我的代码:
HTML:
<div id="elements">
<p>Elementy</p>
<div id="list">
xxx<br />xxx<br />
abc<br />def<br />ghi<br />jkl<br />abc<br />def<br />ghi<br />jkl<br />abc<br />def<br />ghi<br />jkl<br />abc<br />def<br />ghi<br />jkl<br />
</div>
</div>
JS:
$(document).ready(function(){
$('div#elements').mCustomScrollbar({
axis:'y',
theme:'dark',
mouseWheel:{
enable:true,
scrollAmount:5
}
});
});
CSS:
div#elements {
background-color:#fff;
border:1px solid #000;
height:350px;
position:absolute;
right:10%;
top:20%;
width:230px;
z-index:2;
}
div#elements p {
border-bottom:1px solid #000;
cursor:default;
margin:0;
padding:8px 0;
text-align:center;
}
如果有人可以帮助我,我会等待消息。
答案 0 :(得分:9)
好的,我找到了解决方案。所以我必须使用concat版本的代码。
然后您将使用http://malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.concat.min.js,而不是http://malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.min.js。这很愚蠢但是有效。
此致
答案 1 :(得分:0)
尝试解决webpack中的此问题,我在mCustomSrollBar.js文件中注释了几行。
问题在于该文件无法找到要加载mousewheel文件的node_modules文件夹的路由,因此有一个快速解决方案:
function(init){
var _rjs=typeof define==="function" && define.amd, /* RequireJS */
_njs=typeof module !== "undefined" && module.exports, /* NodeJS */
_dlp=("https:"==document.location.protocol) ? "https:" : "http:", /* location protocol */
_url="cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.13/jquery.mousewheel.min.js";
$.event.special.mousewheel || $("head").append(decodeURI("%3Cscript src="+_dlp+"//"+_url+"%3E%3C/script%3E"));
// if(!_rjs){
// if(_njs){
// require("jquery-mousewheel")($);
// }else{
// /* load jquery-mousewheel plugin (via CDN) if it's not present or not loaded via RequireJS
// (works when mCustomScrollbar fn is called on window load) */
// }
// }
init();
}