gpt4 book ai didi

javascript - jQuery 自定义内容滚动条 : remove mouse scrolling

转载 作者:行者123 更新时间:2023-11-28 07:24:09 24 4
gpt4 key购买 nike

我遇到了麻烦,想知道是否有人可以帮忙?我已将 jQuery 自定义内容滚动器合并到我的网站中(链接:http://manos.malihu.gr/jquery-custom-content-scroller/)。该插件很棒,是我需要的一切 - 但是我想知道在使用此插件时是否有办法防止鼠标滚动?所以基本上用户只能使用滚动条而不是使用鼠标滚动。这是我到目前为止的代码:

<head>
<!-- stylesheet for demo and examples -->
<link rel="stylesheet" href="style.css">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->

<!-- custom scrollbar stylesheet -->
<link rel="stylesheet" href="jquery.mCustomScrollbar.css">
</head>
<body>
<center>
<table style="width:100%; height:auto; max-width:1200px; border-bottom:1px solid #c4c4c4;">
<tr>
<td>
title 1
</td>
<td style="text-align:right;">
title 2
</td>
</tr>
<tr>
<td colspan="2">

<br />









<div id="demo" style="padding-left:0x;">


<!-- content -->
<div id="content-1" class="content horizontal-images" style="background-color:white; padding:0px; height:120px;">
<ul>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>
<li><img style="height:70px; width:auto; padding-right:13px; background-color:white;" src="tester.png" /></li>

</div>

</div>



















</td>
</tr>

</table>
</center>







<!-- Google CDN jQuery with fallback to local -->
<script>window.jQuery || document.write('<script src="../js/minified/jquery-1.11.0.min.js"><\/script>')</script>

<!-- custom scrollbar plugin -->
<script src="jquery.mCustomScrollbar.concat.min.js"></script>

<script>
(function($){
$(window).load(function(){

/*
get snap amount programmatically or just set it directly (e.g. "273")
in this example, the snap amount is list item's (li) outer-width (width+margins)
*/
var amount=Math.max.apply(Math,$("#content-1 li").map(function(){return $(this).outerWidth(true);}).get());

$("#content-1").mCustomScrollbar({
axis:"x",
theme:"inset",
advanced:{
autoExpandHorizontalScroll:true
},
scrollButtons:{
enable:true,
scrollType:"stepped"
},
keyboard:{scrollType:"stepped"},
snapAmount:amount,
mouseWheel:{scrollAmount:amount}
});

});
})(jQuery);





</script>
</body>

谢谢 - 非常感谢任何帮助:)

最佳答案

$("#content-1").mCustomScrollbar({enable: false});

关于javascript - jQuery 自定义内容滚动条 : remove mouse scrolling,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31923089/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com