Showing posts with label arrange div position. Show all posts
Showing posts with label arrange div position. Show all posts

Friday, February 17, 2017

click on div and arrange its position as first

Hello. Here i want to saw code for arrange div.
Suppose there are 5 div. All are arranged. When u click on third div, it will come to first position.


<!DOCTYPE html>
<html>
<head>
 <title></title>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

 <script type="text/javascript">

 $(document).ready(function(){
    $(".item-post").click(function() {
      $('.news-layout-1').prepend($(this));
  });

});

 
 </script>
 <style type="text/css">
  h1 { cursor: pointer }
 </style>
</head>
<body>
 <div class="news-layout-1">
   <div class="item-post"><h1 class="item-title">First One</h1></div>
   <div class="item-post"><h1 class="item-title">Second One</h1></div>
   <div class="item-post"><h1 class="item-title">Third One</h1></div>
   <div class="item-post"><h1 class="item-title">Fourth One</h1></div>
   <div class="item-post"><h1 class="item-title">Fifth One</h1></div>
 </div>
</body>
</html>