/ / e.pageX सभी रिज़ॉल्यूशन में ठीक से काम नहीं कर रहा है - jquery, html5, css3

e.pageX सभी रिज़ॉल्यूशन में ठीक से काम नहीं कर रहा है - jquery, html5, css3

एक अवधि पर क्लिक करें, मुझे एक संदेश प्रदर्शित करना होगावह स्थिति तो मैंने माउस क्लिक स्थिति निर्धारित करने के लिए 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");
}

उत्तर:

जवाब के लिए 0 № 1

आपको इस एचटीएमएल मॉडल में सीएसएस संपत्ति सेट करनी होगी:

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

तो सीएसएस संपत्ति होना चाहिए

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

अगर मैं आपको सही समझ गया।