header.html 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. <link rel="stylesheet" href="./css/common.css">
  9. </head>
  10. <body>
  11. <header class="flexB">
  12. <img src="https://cookhome-images-1.oss-cn-hangzhou.aliyuncs.com/guangwangindex/h5/logo.png" alt="" class="logo">
  13. <img src="https://cookhome-images-1.oss-cn-hangzhou.aliyuncs.com/guangwangindex/h5/tabbar.png" alt="" class="tabbar">
  14. </header>
  15. <div class="tabbar_model">
  16. <header class="flexB">
  17. <img src="https://cookhome-images-1.oss-cn-hangzhou.aliyuncs.com/guangwangindex/h5/logo.png" alt="" class="logo">
  18. <img src="https://cookhome-images-1.oss-cn-hangzhou.aliyuncs.com/guangwangindex/h5/tabbar_close.png" alt="" class="tabbar_close">
  19. </header>
  20. <ul>
  21. <li id="index">首页</li>
  22. <li id="brand">品牌荣誉</li>
  23. <li id="notice">新闻动态</li>
  24. <li id="goods">产品介绍</li>
  25. <li id="bussiness">招商加盟</li>
  26. <li id="contact">联系我们</li>
  27. </ul>
  28. </div>
  29. </body>
  30. <script src="./js/jquery.js"></script>
  31. <script>
  32. $(function () {
  33. let name0 = window.location.href;
  34. let names = name0.split('/')
  35. let real_name = names[names.length - 1];
  36. let target = real_name.split('.')[0];
  37. $('#' + target).addClass('active')
  38. if (!target) {
  39. $('#index').addClass('active')
  40. return
  41. }
  42. if (target.indexOf('noticeDetail') != -1) {
  43. $('#notice').addClass('active')
  44. return
  45. }
  46. $('header .tabbar').click(function () {
  47. $('.tabbar_model').fadeIn()
  48. $('.tabbar_model').css('top', 0)
  49. })
  50. $('header .tabbar_close').click(function () {
  51. $('.tabbar_model').fadeOut()
  52. $('.tabbar_model').css('top', '-100rem')
  53. })
  54. $('.tabbar_model ul li').click(function (){
  55. window.location.href = "./" + $(this).attr('id') + '.html'
  56. })
  57. })
  58. </script>
  59. </html>