Search code examples
javascriptjqueryhtmlcssjquery-slider

jQuery slider does not work on Chrome (with interval)


I have a slider which is made by jQuery. It uses next and previous buttons to slide and it has automatic sliding feature with setInterval method.It works on Internet Explorer and Firefox but not on Chrome.How can I solve this problem.T

My little project is here.


Solution

  • It is because when you do

    var totalLi = $("#s li").length;
    var liWidth = $("#s li").width();
    var totalWidth = totalLi * liWidth;
    $("#s").css("width", totalWidth);
    

    images are not loaded, and browser does not know its width and width of li elements, so $("#s li").width() provides 0.

    For example if you will write

    var liWidth = $("#s").width();
    

    instead of

    var liWidth = $("#s li").width();
    

    then it will works, because browser know #s element width from css.