Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <div id="btnWrapper">
- <button onclick="showPage1();">Page 1</button>
- <button onclick="showPage2();">Page 2</button>
- </div>
- <div id="desp">
- <ul id="sortable">
- <li><span></span>Item 1</li>
- <li><span></span>Item 2</li>
- <li><span></span>Item 3</li>
- <li><span></span>Item 4</li>
- </ul>
- </div>
- <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
- <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
- $( function() {
- $( "#sortable" ).sortable();
- $( "#sortable" ).disableSelection();
- } );
- function showPage1(){
- $('#desp').html(
- '<ul id="sortable">'+
- '<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1</li>'+
- '<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li>'+
- '<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li>'+
- '<li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 4</li>'+
- '</ul>'
- );
- }
- function showPage2(){
- $('#desp').html('<h3>Page 2 here...<h3>');
- }
Add Comment
Please, Sign In to add comment