关于Laravel-admin表格自定义操作过多时,当页最后几条的操作栏被遮挡问题解决
需求是表格添加了过多自定义操作,导致点击操作下拉很长的ul,当前页最下面的几条点击操作会因为超出屏幕显示不全。
拿gpt搜了下获取当前点击距页面底端高度方法,再和菜单高度比较,判断是否超出屏幕,给菜单设置top,默认是5px
Admin::script(
<<<JS
$('.grid-dropdown-actions').on('click',function(){
var dropdownMenuHeight = $('.dropdown-menu').height();
var screenHeight = window.innerHeight || document.documentElement.clientHeight;
var clickY = event.clientY;
var distanceToBottom = screenHeight - clickY - 150;
if (distanceToBottom < dropdownMenuHeight) {
var topValue = dropdownMenuHeight - distanceToBottom;
$('.dropdown-menu').css('top', '-'+topValue + 'px');
} else {
$('.dropdown-menu').css('top', '5px');
}
});
JS
);
本作品采用《CC 协议》,转载必须注明作者和本文链接