1

And am using the tinyscrollbar jquery plugin for better scrolling.

If you go to game rules section you will see 5 subsections: Backgammon, Nackgammon, Narde, Tavla and Old English.

The Narde, Tavla and Old English sections work fine, since they do not have a lot of content and only one image. The scrolling has no problems. The "Narde" section does not load fully. The backgammon section also does not load fully and sometimes text goes over the margin. This does not happen always, so it might take a bit of refreshing to see the error.

When I removed all the images from backgammon section, the text loaded just fine. It even loaded fine with 1 image included.

I believe that possibly the jquery tinyscrollbar plugin gets loaded before the content and limits scrolling because of that.

Would be very thankful for people to give tips on solving this problem who have dealt with issues like this in the past.

James Logan
  • 833
  • 1
  • 8
  • 8

4 Answers4

1

If the images are not fully loaded when tinyscrollbar is initialized it cannot calculate the height correctly. To fix this, you need to set a height and width for each image.

You could use a plugin like imagesloaded to detect when the images have fully loaded if you do not know the height and witdth.

andyace
  • 119
  • 1
  • 4
1

You need to use tinyscrollbar_update after the image has loaded.

$(myimage).load(function() { $(scroller).tinyscrollbar_update() }
NoBugs
  • 9,310
  • 13
  • 80
  • 146
0

You could try calling a tinyscrollbar_update once the content is loaded. Do that on a setTimeout. For example,

$("#scrollDiv").tinyscrollbar(); 
//other code if present
//and then finally
setTimeout("$('#scrollDiv').tinyscrollbar_update();",200);

This has worked for me.

mantadt
  • 101
  • 1
  • 15
0

I had the same problem and if you include the tinyscrollbar init after window.load you will no problem.

vaskort
  • 2,591
  • 2
  • 20
  • 29