pluginManager.register('dragLeftSideBar',{
run(){
$('#leftsidebar')
.on('mouseover mousedown',function(e){
const client_x = e.clientX,
trigger_width = 10,
min_width = 250,
$leftsidebar = $(this),
width = $leftsidebar.width(),
is = {
mouseover:e.type === 'mouseover',
mousedown:e.type === 'mousedown',
movePosition: client_x >= width - trigger_width
}
if(is.movePosition){
is.mouseover
&& $leftsidebar
.style('border-right',`${trigger_width}px solid #eee`)
is.mousedown
&& $(window)
.on('mousemove',function(e){
const x = e.pageX,
max_width = $(this).width() * 0.25,
width = $leftsidebar.width();
if(x >= width && x <= max_width){
$leftsidebar
.style('width',x)
}
if(x <= min_width ){
$leftsidebar
.style('width','')
}
})
.on('mouseup',function(){
$(this).off('mousemove')
$leftsidebar
.style('border-right','')
})
}
})
$(document.body)
.append(`
<style>
#jShape.ls-toggle-menu #leftsidebar {
margin-left: 0px !important;
}
</style>
`)
plugin
.systabs
.tabs['ls-toggle-btn']
.action = function({$tab}){
$(document.body)
.toggleClass("ls-toggle-menu")
$tab.removeClass("active")
let ishiddenLeftSidebar = $(document.body).attr('class').includes('ls-toggle-menu')
$windowWidth = $(window).width(),
$leftSidebar = $('#leftsidebar'),
$leftSidebarWidth = $leftSidebar.width()
if(ishiddenLeftSidebar || $windowWidth < 1280){
$leftSidebar
.css('transform',`translateX(-${$leftSidebarWidth}px)`)
}else{
$leftSidebar
.css('transform',`translateX(0)`)
}
}
}
})
.run()
帮楼主把代码贴出来，谢谢楼主分享
