Click the left and right buttons to achieve image carousel effect. The JS Code is as follows:
$ (Function () {var Index = 1; var ppage = 1; var $ v_citemss = $ (". citemss "); var $ v_show = $ v_citemss.find (" Ul "); v_width = $ v_citemss.width (); // the size of the DIV outside the image display area // Note: if it is an integer, the front side cannot be added with VAR; otherwise, underfine p_count = $ v_citemss.find ("Li") will be prompted "). length; // get the number of Li here $ (". slideprev1 "). click (function () {If (! $ V_show.is (": animated") {If (ppage = index) {$ v_show.animate ({right: '0px '}, "3000"); ppage = 4 ;} else {$ v_show.animate ({right: '-=' + v_width}, "3000"); ppage -- ;}}); $ (". slidenext "). click (function () {If (! $ V_show.is (": animated") {If (ppage = p_count) {$ v_show.animate ({left: '0px '}, "3000"); ppage = 1 ;} else {$ v_show.animate ({left: '-=' + v_width}, "3000"); ppage ++ ;}}});});
For the effects of hovering the cursor up and the horizontal description and buttons on the left and right appear below, CSS can be used instead of Js.
Specific Operation: absolute or relative positioning in CSS. The left, right, or bottom values are negative. After the mouse is suspended, the settings are correctly displayed. Set the transition as the animation buffer.
Click the left and right buttons of the carousel image to achieve the carousel effect.