CODEWITHSUNDEEP
javascriptjqueryscroll
AliN11
AliN11

Reputation: 21

Horizontal scroll left doesn't work properly

I would like when i click on button , the div scroll to specified area. for first click all things is ok.but for second click and more , the scroll animataion doesn't work or work with much delays ! This is my jsfiddle : http://jsfiddle.net/AliN11/7CgFp/3/

note: when opening jsfidde please scroll little horizontal scroll in result section of my jsfiddle.

Upvotes: 0

Views: 738

Answers (2)

Praveen
Praveen

Reputation: 2419

Change your javascript like this:

 $(document).ready(function(){
        $("#b1").click(function(){$("#main").animate({ scrollLeft:110 }, "fast");});
        $("#b2").click(function(){$("#main").animate({ scrollLeft:210 }, "fast");});
        $("#b3").click(function(){$("#main").animate({ scrollLeft:310 }, "fast");});
        $("#b4").click(function(){$("#main").animate({ scrollLeft:410 }, "fast");});

    });

Upvotes: 0

jbabey
jbabey

Reputation: 46647

You're appending a new click handler every time the window scrolls. This is not what you want. Just append the click handlers once and be done with it.

$("#b1").click(function(){$("#main").animate({ scrollLeft:110 }, "fast");});
$("#b2").click(function(){$("#main").animate({ scrollLeft:210 }, "fast");});
$("#b3").click(function(){$("#main").animate({ scrollLeft:310 }, "fast");});
$("#b4").click(function(){$("#main").animate({ scrollLeft:410 }, "fast");});

http://jsfiddle.net/7CgFp/4/

Upvotes: 2

Related Questions