将simplemodal模态放在现有div的顶部 [英] Position simplemodal modal on top of an existing div

问题描述

我正在尝试使用simplemodal插件在现有div上放置一个模态对话框。

I'm trying to position a modal dialog on top of an existing div, using simplemodal plugin.

这是我的代码;它不起作用：

Here's my code; it's not working:

jQuery(function ($) {

    $('.slider-caption .basic').click(function (e) {

        var p = $("#slider1");
        var position = p.position();

        $('#basic-modal-content').modal({
            position: "absolute",
            left: position.left,
            top: position.top
        });

        return false;
    });
});

它仍然在窗口中间绘制。我还尝试将 autoPosition 选项设置为false，但这只是让它在左边的现有内容下方绘制。

It's still drawing in the middle of the window. I've also tried to set autoPosition option to false, but that just makes it draw below the existing content at the left.

我正在使用simplemodal的1.4.1版本。

I'm using version 1.4.1 of simplemodal.

推荐答案

以下是我为使其工作所做的工作：

Here's what I did to get it to work:

jQuery(function ($) {
    $('.slider-caption .basic').click(function (e) {

        var position = $("#slider1").offset();

        $('#basic-modal-content').modal({
            appendTo: "#slider1",
            autoPosition: false,
            position: "absolute",
            left: position.left,
            top: position.top
        });

        return false;
    });
});

这篇关于将simplemodal模态放在现有div的顶部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！