expand.html 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3. <head>
  4. <title></title>
  5. <link type="text/css" href="css/default.css" rel="Stylesheet" />
  6. <script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script>
  7. <script type="text/javascript" src="scripts/messagecenter.js"></script>
  8. <script type="text/javascript">
  9. $(document).ready(function () {
  10. $axure.messageCenter.addMessageListener(messageCenter_message);
  11. function messageCenter_message(message, data) {
  12. if(message == 'collapseFrameOnLoad') {
  13. setTimeout(function() {
  14. $('#maximizePanel').animate({
  15. top:'-' + maxPanelHeight + 'px'
  16. }, 300);
  17. }, 2000);
  18. }
  19. }
  20. $axure.messageCenter.postMessage('getCollapseFrameOnLoad');
  21. if(MOBILE_DEVICE) {
  22. $('#maximizePanel').height('45px');
  23. }
  24. var maxPanelHeight = $('#maximizePanel').height();
  25. $('#maximizePanel').click(function () {
  26. $(this).removeClass('maximizePanelOver');
  27. $axure.messageCenter.postMessage('expandFrame');
  28. });
  29. if(!MOBILE_DEVICE) {
  30. $('#maximizePanel').mouseenter(function() {
  31. $(this).addClass('maximizePanelOver');
  32. });
  33. $('#maximizePanel').mouseout(function() {
  34. if($(this).hasClass('maximizePanelOver')) {
  35. $(this).animate({
  36. top:'-' + maxPanelHeight + 'px'
  37. }, 300);
  38. }
  39. $(this).removeClass('maximizePanelOver');
  40. });
  41. $('#maximizePanelOver').mouseenter(function() {
  42. $('#maximizePanel').animate({
  43. top:'0px'
  44. }, 100);
  45. });
  46. }
  47. });
  48. </script>
  49. </head>
  50. <body style="background-color: transparent;">
  51. <div id="maximizePanelOver">
  52. <div id="maximizePanel" class="maximizePanel" title="Expand">
  53. </div>
  54. </div>
  55. </body>
  56. </html>