Nitish Kumar Nitish Kumar - 6 months ago 9
Javascript Question

Re-position of popup in jquery or css

I'm displaying a pop up box by clicking a certain button. Like when you hover over the menu area you get a border while clicking the same area buttons are being displayed, same thing happens with the tab area of

why with us?
But while doing this box is being displayed in an awkward position. It scrolls the main content too. I want it to be fixed and display where its being clicked. Following is the link to my project

I'm taking position with the mouse move function following is the code:

var mouseX;
var mouseY;
$(document).mousemove(function (f) {
mouseX = f.pageX;
mouseY = f.pageY;
});


And putting adding css to popups.

$('#nitstabeditor').fadeIn(400).css({
'top': mouseY
, 'left': mouseX
})


Please help me guys.

CSS being used:

#nitstabeditor {
z-index: 9999;
}
#nitstabeditor {
position: absolute;
top: 10px;
left: 10px;
box-sizing: border-box;
min-width: 250px;
}

Answer

Use preventDefault() to solve this issue for example

$("#nitstabbutton .btn").click(function(event){
    event.preventDefault();
   //your code here
});
Comments