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

Tuesday, 24 January 2017

circular class rotaion in jquery

circular class rotation






 <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