Learn free online HTML5, javascript, and jquery Tutorials by Examples

Tuesday 24 January 2017

circular class rotaion in jquery

circular class rotation



See the Pen circular class rotaion in jquery by satish mallick (@satishmallick)




 <div class="wrapper">
                    <ul class="cur-item">
                        <li class="active">1</li>
                        <li>2</li>
                        <li>3</li>
                        <li>4</li>
                        <li>5</li>
                    </ul>
                    <script>
                       setInterval(function(){
                           var $active = $('ul.cur-item li.active').removeClass('active').next('li');
                           $active.removeClass('active');
                           console.log($active.prevObject.siblings(':first').html())
                           if (!$active.length) $active = $active.prevObject.siblings(':first');
                           $active.addClass('active');
                       },2000);
                    </script>
                    <style>
                        ul.cur-item li.active{font-weight:700; display:block; color:red;}
                    </style>
                </div>

No comments:

Post a Comment