jquery - e.pageX 在所有分辨率下都无法正常工作

Question

onClick a span，我必须在那个位置显示一条消息。所以我使用 e.pageX 来确定鼠标点击位置，因为可能有两个以上的跨度。它在决议中工作正常。如果我最大化分辨率，则消息显示在远离点击范围的地方。

$('div.moveRemoveItems').on('click','.detailRowThree #itemRawHerb',function(e) {
    e.preventDefault();
    $('div#viewboxCR').css( 'left', e.pageX+30 );
    $('div#viewboxCR').show();
    $('div#viewboxCR').css('z-index','999');
}

Answer 1

您应该在此 html 模型中设置 css 属性:

<div class="parent">
    <div class="child">
    </div>
</div>

所以css属性应该是

.parent{
position: fixed;
width: 100%;
height: 100%
top: 0;
left: 0;
}

.child{
position: relative;
width: 200px;
margin: auto;
}

所以它应该可以工作。不过你可以使用 jquery 方法 .resize()，像这样:

$(window).on('resize', function() {
    // your diffirent code here for calcaulating parametrs 
});

如果我没看错的话。