如何修改模式弹出窗口的position CSS样式属性

我有一个jquery bpopup momadal，我想相对于鼠标点击的坐标来定位它。我能够捕获cordinate并将它们传递给样式表，甚至当我显式地对它们进行编码时，模态似乎不支持positioning属性

请查看我在此链接上使用的模态的JS fidle：

---

我想使用“顶部”和“左侧”样式属性。但是这个模式似乎在它的库中有一个默认的中心，你也可以在这个链接上查看它。非常感谢您的帮助。

您用来创建此弹出模式的库正在中心设置模式，方法是动态计算

顶部

和

左侧

样式，然后将它们以内联css样式的形式应用于元素

因此，如果您想覆盖

顶部
和
左侧
以提供您自己的值，您可以通过将样式设置为
来实现这一点！重要信息

#element_to_pop_up { 
    left: 10px !important;
    top:10px  !important;
}

更新的JSFIDLE:
您可以使用

left: 10px !important;

因为模态的位置已经由正在使用的库的脚本内联计算和指定

！重要信息
将为目标元素赋予左/上优先级，使其优先于任何针对同一元素的css样式。
您可以向
bPopup
方法添加
position
属性，该属性将
x
和
y
位置作为这样的数组

$('#element_to_pop_up').bPopup({
    position: [10,100]
});

要将
x
和
y
鼠标坐标传递到弹出窗口，这将是一个选项

$('#my-button').bind('click', function(e) {

    var offset = $(this).offset();
    var x = (e.pageX - offset.left);
    var y = (e.pageY - offset.top);

    // Prevents the default action to be triggered. 
    e.preventDefault();

    // Triggering bPopup when click event is fired
    $('#element_to_pop_up').bPopup({
        position: [x,y]
    });

});

这是一个工作
完美的工作。谢谢
$('#my-button').bind('click', function(e) {

    var offset = $(this).offset();
    var x = (e.pageX - offset.left);
    var y = (e.pageY - offset.top);

    // Prevents the default action to be triggered. 
    e.preventDefault();

    // Triggering bPopup when click event is fired
    $('#element_to_pop_up').bPopup({
        position: [x,y]
    });

});