jcarousel doesn't work properly in Chrome

Question

in my code i am creating a ul li for the jcarousel ie its a list of data(ex. list of photo)

when the photo count is more than say 4 , the jcarousel enables horizontal scrolling so as to see next 4 photos .

PROBLEM: is when i run the code in chrome the horizontal scrolls remain disabled even if number of photos is more than 4, in other browsers it works perfectly..

heres the code which imports jquery file:

     function SetCarousel() {

            $.getScript('<%=Html.LibUrl("jplugins/jquery.jcarousel.pack.js")%>', 
function(result)
                {

                jQuery('#CarouselUL').jcarousel({
                    visible: 4
                });
            });

        }

i have tried refering .js file @ top of page(aspx) didn't work ..even made it worse

pls help

Answer 1

I fixed this on a site I was working on by commenting out code which specifies Safari; for some reason the fixes they put in appear to have become obsolete. I'm using jQuery 1.3.2.

Here's the code I stripped out:

jquery.carousel.js:around line 184

    /*if ($.browser.safari) {
      this.buttons(false, false);
      $(window).bind('load', function() { self.setup(); });
    } else */
      this.setup();

jquery.carousel.js:around line 858

            /*if (p == 'marginRight' && $.browser.safari) {
            var old = {'display': 'block', 'float': 'none', 'width': 'auto'}, oWidth, oWidth2;

            $.swap(el, old, function() { oWidth = el.offsetWidth; });

            old['marginRight'] = 0;
            $.swap(el, old, function() { oWidth2 = el.offsetWidth; });

            return oWidth2 - oWidth;
            }*/

Hopefully this fix will help you and others who come across the problem!

Answer 2

I tried number 1 solution and it worked. Nice man, thank you very much. I just commented the lines:

/*if ($.browser.safari) {
  this.buttons(false, false);
  $(window).bind('load', function() { self.setup(); });
} else */
  this.setup();

Answer 3

This is awesome my problem is resolved thanks jsims281

In my case i have used

jquery.jcarousel.min

and the code commented is line no 134 to 139

/*if(!q&& i.browser.safari){
            this.buttons(false,false);
            i(window).bind("load.jcarousel",function(){
                g.setup()
                })
            }else */ this.setup()
            };

and line no 470 to 484

 /*if(c=="marginRight"&&i.browser.safari){
            var d={
                display:"block",
                "float":"none",
                width:"auto"
            },e,f;
            i.swap(b,d, function(){
                e=b.offsetWidth
                });
            d.marginRight=0;
            i.swap(b,d,function(){
                f=b.offsetWidth
                });
            return f-e
            }*/

Answer 4

In version 0.2.9 this worked for me.
I took the minified version and threw it through the http://jsbeautifier.org and changed the following on line 95

}, null !== this.options.initCallback && this.options.initCallback(this, "init"), !c && d.isSafari() ? (this.buttons(!1, !1), a(window).bind("load.jcarousel", function ()
{
l.setup()
})) : this.setup()

to

    }, null !== this.options.initCallback && this.options.initCallback(this, "init"), !c /*&& d.isSafari() ? (this.buttons(!1, !1), a(window).bind("load.jcarousel", function ()
    {
        l.setup()
    })) :*/ this.setup()