JQuery plug-in Elastislide enables responsive focus graphs to implement seamless rolling switching of special effects

JQuery plug-in Elastislide enables responsive focus graphs to implement seamless rolling switching of special effects

Supports the responsive jQuery focus image seamless rolling switching special effect plug-in Elastislide. It is a very beautiful image carousel special effect plug-in that supports left and right carousel images, upstream and downstream carousel images, and adaptive mobile terminal display, multiple Parameter configurations are supported: orientation: 'horizontal '(horizontal switching), speed: 500 (switching speed, in milliseconds), easing: 'animated-in-out' (animation effect), minItems: 3 (default display quantity), and so on. browser compatibility: IE8 +, and more modern browsers, I don't mind if you can use a browser of a lower version, but you can also use a mobile touch screen.

Supports the responsive jQuery focus image seamless rolling switching special effect plug-in Elastislide

Usage:

1. Load jQuery and plug-ins

1 2 3 4

<Script type = "text/javascript" src = "libs/jquery/1.8.2/jquery. min. js"> </script> <Script type = "text/javascript" src = "js/jquerypp. custom. js"> </script> <Script type = "text/javascript" src = "js/jquery. elastislide. js"> </script> <Link rel = "stylesheet" type = "text/css" href = "css/elastislide.css"/>

2. HTML content

1 2 3 4 5 6 7 8

<Ul id = "carousel" class = "elastislide-list"> <Li> <a href = "#"> </a> </li> <Li> <a href = "#"> </a> </li> <Li> <a href = "#"> </a> </li> <Li> <a href = "#"> </a> </li> <Li> <a href = "#"> </a> </li> <Li> <a href = "#"> </a> </li> </Ul>

3. function call

1 2 3 4 5

<Script type = "text/javascript"> $ (Document). ready (function (){ $ ('# Invalid usel'). elastislide (); }); </Script>