floraachy/shopxo
1
0
Fork 0
mirror of https://gitee.com/zongzhige/shopxo.git synced 2024-11-29 18:39:16 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

滚动条样式优化、新增tabs切换公共方法

Browse Source
This commit is contained in:
gongfuxiang 2022-10-09 00:48:06 +08:00
parent 6f14021f87
commit 7df231f630
2 changed files with 65 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
public/static/common/css/common.css
View File

@ -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;
}

25
public/static/common/js/common.js
View File

@ -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;
});
});