uislider - Slider in li using jquery -
this code working next prev not gives smooth sliding effect. please make smooth. have variours list data need shown in slider effect next prev button.
$(document).ready(function () { $('#prev').hide(); var $lis = $("#mylist li").hide(); $lis.slice(0, 10).show(); var size_li = $lis.length; var x = 10, start = 0; if(size_li == x) { $('#prev').hide(); $('#next').hide(); } $('#next').click(function (e) { e.stoppropagation(); $('#prev').show(); if (start + x < size_li) { $lis.slice(start, start + x).hide(); start += 1; $lis.slice(start, start + x).show(); } if(start + x == size_li) { $('#next').hide(); } }); $('#prev').click(function () { $('#next').show(); if (start >= 1) { $lis.slice(start, start + x).hide(); start -= 1; $lis.slice(start, start + x).show(); } if(start == 0) { $('#prev').hide(); } }); });
simplest answer least code add 'slow'
attribute hide()
, show()
. instead of hide()
hide('slow')
, instead of show()
show('slow')
.
you can apply css elements shown/hidden, this
.elm { transition: lienar 500ms; -webkit-transition: lienar 500ms; -moz-transition: lienar 500ms; }
in case 'slow'
property not required.
Comments
Post a Comment