malihu / malihu-custom-scrollbar-plugin

Highly customizable custom scrollbar jQuery plugin, featuring vertical/horizontal scrollbars, scrolling momentum, mouse-wheel, keyboard and touch support etc.
http://manos.malihu.gr/jquery-custom-content-scroller
MIT License
4.11k stars 1.51k forks source link

Horizontal Scrollbar not working after image load #627

Open daLaaag opened 5 years ago

daLaaag commented 5 years ago

I have the problem that I am using a chart-library in my project that provides functionality for displaying pretty diagrams and charts. These diagrams offer the possibility to draw on them. To do this, a button needs to be pressed. When pressed, the "upd" method of the custom scrollbar is called and "if(o.advanced.updateOnImageLoad){" if-block is entered. Up to this point the scrollbar works fine. To finish drawing another button needs to be pressed. After that button is pressed, the scrollbar is not working correctly anymore. It does not resize itself anymore. After setting different breakpoints, I figured out that the "upd" method is not called anymore after second button was pressed. After further debugging, I discovered, that when pressing the second button, the code was not able to find an image. Or in other words: the following each loop would not be entered anymore: mCSB_container.find("img").each(function(){imgLoader(this);}); Therefore, there is no "doUpd" call and after that the scrollbar is not working properly anymore.

My suggestion would be to add code to that check to see if an image was loaded/found and if not call "doUpd(1)" so that the scrollbar keeps firing the upd-events.

I would suggest the following code: /* remember if an image was found */ var imageFound = false; mCSB_container.find("img").each(function(){ imgLoader(this); imageFound = true; }); /* if no image was found, there would be no update call and hence the clearing of the time out would result in the scrollBar not adjusting or working anymore -> in case of no imaghe, update everything to ensure that the scrollbars are working correctly. */ if (imageFound === false) { doUpd(1); }