0

我有另一个关于 jQuery 工具的新手问题（http://flowplayer.org/tools/overlay/index.html）。单击图像时，我触发了一个叠加层，其代码在 html 正文中看起来相对像这样。

<img id = "shark" src = "http://static.guim.co.uk/sys-images/Education/Pix/picture
s/2000/11/13/shark.jpg" alt = "click" />

<div id = "overlayFrame">
    <div id = "overlayContent"></div>
</div>

<script type= "text/javascript">
    var clickable = document.getElementById('shark');
    clickable.onmousedown = ImageClick;
    
    function ImageClick(e)
    {
        console.log("image clicked");
        $("#overlayFrame").overlay
        ({
            mask: 'darkgrey',
            oneInstance: false,
            
            onBeforeLoad: function()
            {
                var wrap = this.getOverlay().find("#overlayContent");
                wrap.load("overlay.htm");
            },
            
            load: true
        });
    }
</script>

我希望每次单击图像时都会出现叠加层。现在，每次单击图像时，“单击图像”都会打印到控制台，但覆盖仅在第一次发生。如何更改此代码以使覆盖每次都发生？

4

1 回答 1

0

我没有测试你的具体代码，但我解决了同样的问题，即每次调用 overlay().load() 以编程方式重复加载。我认为这对你有用。请参阅下面的最后一行：

<script type= "text/javascript">
var clickable = document.getElementById('shark');
clickable.onmousedown = ImageClick;

function ImageClick(e)
{
    console.log("image clicked");
    $("#overlayFrame").overlay
    ({
        mask: 'darkgrey',
        oneInstance: false,

        onBeforeLoad: function()
        {
            var wrap = this.getOverlay().find("#overlayContent");
            wrap.load("overlay.htm");
        },

        load: true
    }).load(); // This is the only code I added
}
</script>
于 2012-12-14T00:45:05.143 回答