3

code updated : http://mawk3y.net/test/brand.php?id=12

the original jquery plugin is here http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html

$(".content1").mCustomScrollbar({
scrollButtons:{
enable:true
}
});
$("#contact_details").mCustomScrollbar({
scrollButtons:{
enable:true
}
});

.content1 is the div with the problem : custom scrollbar doesn't show up untill you resize the window or start firebug and contact_details is the div inside the first tab which is without any problem though both divs contain text only."

jq beginner
  • 1,010
  • 3
  • 21
  • 41

2 Answers2

0

The problem is your 

$(window).load(function(){

is inside your

$(document).ready(function(e) {

Remove the document ready function if your going to have images inside this div. Otherwise Remove the window load function. You won't need both.

Richard Dillman
  • 334
  • 1
  • 9
  • no it's not the problem because i've moved the code outside document ready and the problem is still on (source code is inside document ready and i just copied it) – jq beginner Jan 24 '13 at 06:06
  • and when writing the code inside the document ready without window.load it doesn't work at all. I've updated code please check again. – jq beginner Jan 24 '13 at 06:08
0

Your inline CSS for the scroll bar within #content_11 has display:none set. 

<div class="mCSB_scrollTools" style="position: absolute; display: none;"> ... </div>

When you re-size the page, the plug-in is overwriting that element, which makes it appear. By manually replacing display: none with display: block; in my browser, I can make the scroll bar appear (albeit in the wrong place).

Your functional div, #contact_details has display: block already. 

<div class="mCSB_scrollTools" style="position: absolute; display: block;">...</div>
Rob Allen
  • 17,381
  • 5
  • 52
  • 70