From 7df231f6309e7fc87eb8bbe4fd36de113e08bf7c Mon Sep 17 00:00:00 2001 From: gongfuxiang Date: Sun, 9 Oct 2022 00:48:06 +0800 Subject: [PATCH] =?UTF-8?q?=E6=BB=9A=E5=8A=A8=E6=9D=A1=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=E4=BC=98=E5=8C=96=E3=80=81=E6=96=B0=E5=A2=9Etabs=E5=88=87?= =?UTF-8?q?=E6=8D=A2=E5=85=AC=E5=85=B1=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/static/common/css/common.css | 40 +++++++++++++++++++++++++++++ public/static/common/js/common.js | 25 ++++++++++++++++++ 2 files changed, 65 insertions(+) diff --git a/public/static/common/css/common.css b/public/static/common/css/common.css index d9ece3eee..aa8a3657c 100755 --- a/public/static/common/css/common.css +++ b/public/static/common/css/common.css @@ -1202,4 +1202,44 @@ form .am-tab-panel .am-form-group:last-child { } .form-legend-fixed-right .am-badge:not(:first-child) { margin-left: 10px; +} + + +/** + * 滚动条样式 + */ +::-webkit-scrollbar { + width: 3px; + height: 6px; +} +::-webkit-scrollbar-button, +::-webkit-scrollbar-button:vertical { + display: none; +} +::-webkit-scrollbar-track, +::-webkit-scrollbar-track:vertical { + background-color: black; +} +::-webkit-scrollbar-track-piece { + background-color: #fafafa; +} +::-webkit-scrollbar-track-piece { + border-top: 1px solid rgba(0,0,0,.01); +} +::-webkit-scrollbar-thumb, +::-webkit-scrollbar-thumb:vertical { + margin-right: 10px; + background-color: #f0f0f0; +} +::-webkit-scrollbar-thumb:hover, +::-webkit-scrollbar-thumb:vertical:hover { + background-color: #a9a9a9; +} +::-webkit-scrollbar-corner, +::-webkit-scrollbar-corner:vertical { + background-color: #e5e5e5; +} +::-webkit-scrollbar-resizer, +::-webkit-scrollbar-resizer:vertical { + background-color: #ff6e00; } \ No newline at end of file diff --git a/public/static/common/js/common.js b/public/static/common/js/common.js index 5e5efa92b..4be0b8163 100755 --- a/public/static/common/js/common.js +++ b/public/static/common/js/common.js @@ -3819,4 +3819,29 @@ $(function() var number = $(this).data('number') || '-1'; window.history.go(number); }); + + // 页面切换 + var temp_scroll_original_index = 0; + $(document).on('click', '.tabs-switch-horizontal-container ul li', function() + { + var $scroll_obj = $(this).parents('.tabs-switch-horizontal-container'); + var parent_width = $scroll_obj.width(); + var current_width = $(this).outerWidth(true); + var current_index = $(this).index(); + if(current_index != temp_scroll_original_index) + { + // 计算当前元素前面的元素宽度(含padding、margin、border) + var scroll = 0; + for(var i=0;i<=current_index;i++) + { + scroll += $scroll_obj.find('ul li:eq('+i+')').outerWidth(true); + } + // 减去父元素宽度一半 + scroll -= parent_width/2; + // 减去当前元素宽度一半 + scroll -= current_width/2; + $scroll_obj.animate({'scrollLeft': scroll}); + } + temp_scroll_original_index = current_index; + }); }); \ No newline at end of file