layui layer弹出层通过offset属性定位弹出层在光标处弹出(event.clientY和event.clientX)失败。

将弹出层弹出位置定位到光标处,大小超过父弹出层的部分无法显示

在这里插入图片描述

.js

//页面层-自定义
$("#more").click(function (event) {
    layer.open({
        id:"moreMenu",
        type: 1,
        title: false,
        closeBtn: 0,
        shadeClose: true,
        shade:0.0001,
        skin: 'menuBody',
        resize:false,
        offset: [event.clientY,event.clientX],
        // area:['200px','300px'],
        content: '<style>' +
            '.menu{' +
            'font-size:12px;' +
            'font-family:微软雅黑;}' +
            '.moreMenu-top{\n' +
            '    width: 100px;\n' +
            '    margin-left: 1px;\n' +
            '    margin-right: 1px;\n' +
            '    margin-top: 2px;\n' +
            '    padding: 5px' +
            '}\n' +
            '.moreMenu-mid{\n' +
            '    width: 100px;\n' +
            '    margin-left: 1px;\n' +
            '    margin-right: 1px;\n' +
            '    padding: 5px' +
            '}\n' +
            '.moreMenu-bottom{\n' +
            '    width: 100px;\n' +
            '    margin-left: 1px;\n' +
            '    pmargin-right: 1px;\n' +
            '    margin-bottom: 2px;\n' +
            '    padding: 5px' +
            '}\n' +
            '.menuOver{\n' +
            '    background: lightgrey; \n' +
            '}</style>' +
            '<div class="menu moreMenu-top">回复</div>' +
            '<div class="menu moreMenu-mid">删除</div>' +
            '<div class="menu moreMenu-bottom">彻底删除</div>' +
            '<script>' +
            '$(".menu").hover(function() {' +
            '$(this).addClass("menuOver")' +
            '},function() {' +
            '$(this).removeClass("menuOver")' +
            '})' +
            '</script>',
    });
})

若采用top.layer.open打开弹出层,则弹出层定位出现问题,无法正确定位光标位置,没有搞明白为什么

采用top.layer.open后超过父弹出层的部分可以正确显示,但位置不正确。
在这里插入图片描述
问题未解决

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值