slide.html 1.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style type="text/css" media="screen">
  5. body {
  6. font-size: 14px;
  7. font-family: "Trebuchet MS", "Helvetica", "Arial", "Verdana", "sans-serif";
  8. }
  9. #test {
  10. width: 200px;
  11. height: 300px;
  12. position: absolute;
  13. top: 50px;
  14. left: 150px;
  15. }
  16. .over {
  17. display: none;
  18. position: absolute;
  19. background-color: #FFFFFF;
  20. }
  21. </style>
  22. <link rel="stylesheet" href="../themes/nokia/base.css" type="text/css" media="screen" title="no title" charset="utf-8">
  23. <link rel="stylesheet" href="../themes/custom-theme/ui.all.css" type="text/css" media="screen" title="no title" charset="utf-8">
  24. <script src="../lib/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>
  25. <script src="../lib/jquery/jquery.scrollTo.js" type="text/javascript" charset="utf-8"></script>
  26. <script src="../src/core.js" type="text/javascript" charset="utf-8"></script>
  27. <script src="../src/util.js" type="text/javascript" charset="utf-8"></script>
  28. <script src="../src/widget.js" type="text/javascript" charset="utf-8"></script>
  29. <script src="drag.js" type="text/javascript" charset="utf-8"></script>
  30. </head>
  31. <body>
  32. <div id="test" class="ui-widget-header ui-corner-all">
  33. Drag-me!
  34. </div>
  35. <br><br><br><br>
  36. <button id="toggle">
  37. toggle
  38. </button>
  39. <script type="text/javascript" charset="utf-8">
  40. jQuery(document).ready(function() {
  41. jQuery('#toggle').click(function() {
  42. Nokia.util.slide('#test');
  43. });
  44. });
  45. </script>
  46. </body>
  47. </html>