CODEWITHSUNDEEP
javascriptjqueryperformancesliderresponsive-design
Scratcha
Scratcha

Reputation: 1401

How could this jQuery slider be optimised ? (Slow, laggy)

I have written a Javascript/jQuery script. Its purpose is to serve as a responsive background image slider.

It is viewable here: http://new.upserver.co.uk/rbis/

My question is this;

While the code functions correctly, it can be slow/laggy. Especially when additional animation related plugins appear on the same page (i.e. nivoslider).

I have seen many similar sliders that handle chunky images perform effortlessly and am concerned and wondering how this code could be optimised to perform better? the javascript in question is located in file http://new.upserver.co.uk/rbis/rbis.js

Many thanks for all suggestions. Regards

Upvotes: 1

Views: 1276

Answers (1)

Rich Bradshaw
Rich Bradshaw

Reputation: 72975

jQuery animate is rarely the right tool for providing animation. Take a look at this rather contrived example I produced recently: http://css3.bradshawenterprises.com/demos/speed.php.

I would recommend using CSS transitions in normal browsers, and only using the old way of doing it using javascript in old browsers.

A good way to do that is to use something like http://playground.benbarnett.net/jquery-animate-enhanced/, though I have had some issues with that, and instead use my own methods of doing it.

Upvotes: 1

Related Questions