jQuery bxSlider does not start at the right position

Question

I cannot find out what I am doing wrong. So far, I have tested this only in Internet Explorer, so it could be that Firefox and Chrome aren't parsing the code properly.

http://ontwikkelomgeving.wijzijnblits.nl/ginkelbemmelen/luuk/

My problem is that the bxSlider on the page will start approximately 20px to the right. I do not define this (as far as I know) so I don't know why this is happening. If you click the 1 button, then it slides to the right place.

Answer 1

Add this style in slider1 padding:0px !important;

<ul id="slider1" style="list-style: none outside none;padding:0px !important;">

Answer 2

Luuk or anyone else,

Add

style='margin:0 0 0 0;' 

to the tag at the start of your list of scrolling objects, completely sorted it for me

Answer 3

Try this: Wherever there are functions with .outerHeight() or .outerWidth() calls, change this to -> .outerWidth(true) .outerHeight(true)

It does mean bxSlider count margins as well. It helps me to fix bad-position issues.

Answer 4

i had the same problem. for #slider1, use liststyle: none; worked for me.

Answer 5

What fixed any problems like this for me was to activate the plugin after the page has loaded.

If you are using jquery, that do it like this

$(window).load(function() {
      //add your code here
)};

Mootools, it would be like this

$('document').addEvent('domready', function() { 
    //code here...
});