index.html 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8"/>
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <title>首页</title>
  7. <meta name="viewport" content="width=device-width, initial-scale=1">
  8. <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  9. <link>
  10. <style>
  11. * {
  12. margin: 0;
  13. padding: 0
  14. }
  15. html, body, .box {
  16. width: 100%;
  17. height: 100%;
  18. overflow: hidden;
  19. }
  20. .header {
  21. width: 100%;
  22. background: rgba(0, 3, 143, 1);
  23. color: white;
  24. padding: 1px;
  25. }
  26. .content {
  27. width: 100%;
  28. height: calc(100% - 42px);
  29. }
  30. .left {
  31. float: left;
  32. width: 200px;
  33. height: 100%;
  34. background: rgba(242, 242, 242, 1);
  35. }
  36. .left p {
  37. width: 100%;
  38. text-align: center;
  39. font-size: 18px;
  40. color: #797979;
  41. margin: 20px 0;
  42. cursor: pointer;
  43. }
  44. .right{
  45. float: left;
  46. width: calc(100% - 200px);
  47. height: 100%;
  48. }
  49. .show button {
  50. margin-top: 3%;
  51. color: white;
  52. background: rgba(22, 155, 213, 1);
  53. width: 6%;
  54. border-radius: 5px;
  55. margin-left: 3%;
  56. }
  57. </style>
  58. </head>
  59. <body>
  60. <div class="box">
  61. <div class="header"><h1>微博数据分析</h1></div>
  62. <div class="content">
  63. <div class="left">
  64. <p><span style="background:rgb(215,215,215)" ; onclick="changeIframe(this,'./html/WBAccount')">微博号管理</span>
  65. </p>
  66. <p><span onclick="changeIframe(this,'./html/WBData')">微博数据分析</span></p>
  67. <p><span onclick="changeIframe(this,'./html/Comment')">微博评论爬虫</span></p>
  68. </div>
  69. <div class="right">
  70. <iframe src="./html/WBAccount.html" frameborder="0" style="
  71. height: 100%;
  72. width: 100%;"></iframe>
  73. </div>
  74. </div>
  75. </div>
  76. </body>
  77. </html>
  78. <script>
  79. changeIframe = function (wt, el) {
  80. let span = $("span");
  81. for (let i = 0; i < span.length; i++) {
  82. span[i].style.background = "rgba(242, 242, 242, 1)";
  83. }
  84. wt.style.background = "rgb(215,215,215)";
  85. let _href = el + ".html";
  86. let iframe = $("iframe")[0];
  87. iframe.src = _href;
  88. }
  89. </script>