I found the solution.
First of all the problem was in an option of Malihu Scrollbars called autoExpandHorizontalScroll. I am not sure what this option exactly does but it is necessary. If this option is not on, the scrollbar doesn't appear when I put my table in the accordion. When I put my table outside the accordion the scrollbar works fine even with autoExpandHorizontalScroll set off. My code in XHTML is:
<script>
(function($){
$(window).load(function(){
$(".horizontalScrollbar").mCustomScrollbar({
scrollButtons:{ enable:false },
horizontalScroll:true,
advanced:{autoExpandHorizontalScroll:true}
});
});
})(jQuery);
</script>
As I said before, when I put my table outside the accordion the scrollbar appears anyway. The difference is that when autoExpandHorizontalScroll is true I get the autoscroll problem (described in the original post), but when I set it to false, my body stops this annoying autoscrolling. So I decided to take a look at Malihu's code to see what this option does.
autoExpandHorizontalScroll appears in two functions: init:function(options)
, and update:function()
and it does just the following in both cases:
mCSB_container.css({"position":"absolute","width":"auto"}).wrap("<div class='mCSB_h_wrapper' style='position:relative; left:0; width:999999px;' />").css({"width":mCSB_container.outerWidth(),"position":"relative"}).unwrap();
I don't know what the idea here is, but after some experimenting with it, I just removed the part that is in init:function(options)
(comment it on line 214) and left the part that is in the update function. After this, the scrollbar works perfectly in the accordion and no autoscroll problem is bothering me anymore.
By the way: Sorry for posting a so specific question. I hope somebody finds it useful