I'm implementing the jQuery plugin niceScroll in my DIV's. It works beautifully except when I add an .load() function to a tag that is using niceScroll, no scrolling works. But if I remove niceScroll, then the native scroller works fine...?
This is targeting a webKit browser. Any Ideas or am I being a goof in my code?
$(document).ready(
function(e) {
$("#west").load('http://mySite.comregulatory_list.php', '', function(response, status, xhr) {
if (status == 'error') {
var msg = "Sorry but there was an error: ";
$(".content").html(msg + xhr.status + " " + xhr.statusText);
}
});
$("#west").niceScroll({
cursorcolor : "#6699FF",
cursorwidth : "2px",
grabcursorenabled : "false",
preservenativescrolling : "false",
cursorborder : "0px",
scrollspeed : "20",
});
})
The niceScroll
plugin is almost certainly updating the HTML structure of the #west
element, so you should either target the specific content-container within the #west
element or re-initialize the niceScroll
plugin when you load the new content:
$("#west").load('http://mySite.comregulatory_list.php', '', function(response, status, xhr) {
if (status == 'error') {
var msg = "Sorry but there was an error: ";
$(".content").html(msg + xhr.status + " " + xhr.statusText);
} else {
$(this).niceScroll({
cursorcolor : "#6699FF",
cursorwidth : "2px",
grabcursorenabled : "false",
preservenativescrolling : "false",
cursorborder : "0px",
scrollspeed : "20",
});
}
});