toobar.php 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. <style>
  2. body{
  3. margin: unset;
  4. }
  5. .index_toolbar{
  6. position:unset;
  7. }
  8. .search_toolbar{
  9. height: initial;
  10. padding: 0.7em 1em 0 1em;;
  11. background-color: var(--tool-bg-color1);
  12. border-bottom: none;
  13. color: var(--tool-color1);
  14. }
  15. .search_fixed{
  16. position: fixed;
  17. top:-500px;
  18. width:100%;
  19. display:flex;
  20. padding: 0.5em 1em;
  21. }
  22. </style>
  23. <!-- tool bar begin-->
  24. <div id='search_toolbar' class="search_toolbar">
  25. <div style="display:flex;">
  26. <span >
  27. <?php echo $_local->gui->search;?>
  28. </span>
  29. <div>
  30. <div>
  31. <input id="dict_ref_search_input" type="input" placeholder="<?php echo $_local->gui->search;?>" onkeyup="search_input_keyup(event,this)" style=" margin-left: 0.5em;width: 40em;max-width: 80%;font-size:140%;padding: 0.6em;color: var(--btn-hover-bg-color);background-color: var(--btn-color);" onfocus="search_input_onfocus()">
  32. </div>
  33. <div id="pre_search_result" style="background-color: var(--btn-color);z-index: 50;">
  34. <div id="pre_search_word" class="pre_serach_block">
  35. <div id="pre_search_word_title" class="pre_serach_block_title">
  36. <div id="pre_search_word_title_left">单词</div>
  37. <div id="pre_search_word_title_right"></div>
  38. </div>
  39. <div id="pre_search_word_content" class="pre_serach_content">
  40. </div>
  41. </div>
  42. </div>
  43. </div>
  44. </div>
  45. <div style="display:block;z-index: 5;">
  46. <ul id="dict_type" class="lab_tab" style="color:black;">
  47. <?php
  48. if(isset($_GET["key"])){
  49. $key = "?key=".$_GET["key"];
  50. }
  51. else{
  52. $key = "";
  53. }
  54. ?>
  55. <li id="dt_all" ><a href="../search/index.php<?php echo $key;?>"><span ><?php echo $_local->gui->all;//全部?></span><span id="search_all_num"></span></a></li>
  56. <li id="dt_title" ><a href="../search/title.php<?php echo $key;?>"><span ><?php echo $_local->gui->title;//标题?></span><span id="search_title_num"></span></a></li>
  57. <li id="dt_pali" ><a href="../search/paliword.php<?php echo $key;?>"><span ><?php echo $_local->gui->full_text;//巴利原文?></span><span id="search_palitext_num"></span></a></li>
  58. <li id="dt_bold" ><a href="../search/bold.php<?php echo $key;?>"><span ><?php echo $_local->gui->vannana;?></span><span id="search_bold_num"></span></a></li>
  59. <li id="dt_trans" ><a href="../search/trans.php<?php echo $key;?>"><span ><?php echo $_local->gui->translate;?></span><span id="search_trans_num"></span></a></li>
  60. </ul>
  61. </div>
  62. </div>
  63. <!--tool bar end -->
  64. <!-- tool bar fixed begin-->
  65. <div id='search_toolbar_1' class="search_toolbar search_fixed">
  66. <div style="display:flex;">
  67. <span >
  68. 搜索
  69. </span>
  70. <div>
  71. <div>
  72. <input id="dict_ref_search_input_1" type="input" placeholder="<?php echo $_local->gui->search;?>" onkeyup="search_input_keyup(event,this)" style="margin-left: 0.5em;width: 40em;max-width: 80%;font-size:140%;padding: 0.3em;color: var(--btn-hover-bg-color);background-color: var(--btn-color);" onfocus="search_input_onfocus()">
  73. </div>
  74. <div id="pre_search_result_1" style="position: absolute;max-width: 100%; width: 50em;background-color: var(--btn-color);z-index: 51;display: none;">
  75. <div class="pre_serach_block">
  76. <div class="pre_serach_block_title">
  77. <div id="pre_search_word_title_left_1">单词</div>
  78. <div id="pre_search_word_title_right_1"></div>
  79. </div>
  80. <div id="pre_search_word_content_1" class="pre_serach_content">
  81. </div>
  82. </div>
  83. </div>
  84. </div>
  85. </div>
  86. <div style="display:block;z-index: 5;">
  87. <ul id="dict_type" class="lab_tab" style="color:black;">
  88. <?php
  89. if(isset($_GET["key"])){
  90. $key = "?key=".$_GET["key"];
  91. }
  92. else{
  93. $key = "";
  94. }
  95. ?>
  96. <li id="dt_all_1" ><a href="../search/index.php<?php echo $key;?>"><span >全部</span><span id="search_all_num_1"></span></a></li>
  97. <li id="dt_title_1" ><a href="../search/title.php<?php echo $key;?>"><span >标题</span><span id="search_title_num_1"></span></a></li>
  98. <li id="dt_pali_1" ><a href="../search/paliword.php<?php echo $key;?>"><span >巴利原文</span><span id="search_palitext_num_1"></span></a></li>
  99. <li id="dt_bold_1" ><a href="../search/bold.php<?php echo $key;?>"><span ><?php echo $_local->gui->vannana;?></span><span id="search_bold_num_1"></span></a></li>
  100. <li id="dt_trans_1" ><a href="../search/trans.php<?php echo $key;?>"><span ><?php echo $_local->gui->translate;?></span><span id="search_trans_num_1"></span></a></li>
  101. </ul>
  102. </div>
  103. </div>
  104. <!--tool bar fixed end -->
  105. <script>
  106. window.addEventListener('scroll',winScroll);
  107. function winScroll(e){
  108. if(GetPageScroll().y>150){
  109. $("#search_toolbar_1").css("top",0) ;
  110. }
  111. else{
  112. $("#search_toolbar_1").css("top",GetPageScroll().y - 150) ;
  113. }
  114. }
  115. //滚动条位置
  116. function GetPageScroll()
  117. {
  118. var pos=new Object();
  119. var x, y;
  120. if(window.pageYOffset)
  121. { // all except IE
  122. y = window.pageYOffset;
  123. x = window.pageXOffset;
  124. } else if(document.documentElement && document.documentElement.scrollTop)
  125. { // IE 6 Strict
  126. y = document.documentElement.scrollTop;
  127. x = document.documentElement.scrollLeft;
  128. } else if(document.body) { // all other IE
  129. y = document.body.scrollTop;
  130. x = document.body.scrollLeft;
  131. }
  132. pos.x=x;
  133. pos.y=y;
  134. return(pos);
  135. }
  136. </script>