简体   繁体   English

jQuery关闭覆盖-自定义按钮

[英]JQuery Close Overlay - Custom Button

I am using JQuery Overlay from FlowPlayer. 我正在使用FlowPlayer的JQuery Overlay。

I have this that opens my overlay: 我有这个打开我的覆盖物:

<a rel="#overlay1" class="miniOpenBtn">Open</a>
$("a[rel]").overlay({mask: '#EFEFEF'});

I am bored of the standard close button and would like to add my own button, that's positioned anywhere inside my overlay: 我对标准的关闭按钮感到厌倦,并想添加自己的按钮,该按钮位于叠加层内的任何位置:

<a id="closeOverlay" class="miniCloseBtn">x</a>

How can I get this link to close the overlay? 如何获得此链接以关闭叠加层?

I looked at the documentation and they only give an example of replacing the original close button in the corner of the overlay, using class "close". 我看了看文档,他们只提供了一个使用class“ close”替换覆盖角中原始关闭按钮的示例。 I want to get rid of that original close button altogether and place additional ones inside the overlay. 我想完全摆脱原来的“关闭”按钮,并将其他按钮放到覆盖层内。

I have looked at some old answers here on StackOverflow but having only started to learn JQuery last week, it's a little confusing to say the least. 我在StackOverflow上查看了一些旧的答案,但是上周才开始学习JQuery,至少可以说有点令人困惑。

Any help gratefully received. 非常感谢任何帮助。

You could just remove the div that the overlay is: 您可以删除叠加层为的div:

$('.miniCloseBtn').click(function(){
  $('.overlay_div').remove();
});

If you can get a handle on the overlay to select against (say, it has an ID of 'overlay'), you can do this: 如果您可以在叠加层上找到要选择的句柄(例如,其ID为“叠加层”),则可以执行以下操作:

$('#overlay').find('.close').replaceWith('<a href="#" class="close miniCloseBtn">x</a>');

In general, I think anything you create with a class of 'close' will close the overlay. 总的来说,我认为您使用“关闭”类创建的所有内容都会关闭叠加层。

I tried this and got it working, after a long hard search in their forums. 在他们的论坛中进行了长时间的认真搜索后,我尝试了一下并使其正常工作。 By applying (close:"a.closeOverlayBtn"), it allows me to use a different button for closing the overlay. 通过应用(close:“ a.closeOverlayBtn”),它允许我使用其他按钮来关闭叠加层。

The JQuery jQuery的

$("a[rel]").overlay({
mask: '#EFEFEF',
close: "a.closeOverlayBtn"
});

The Overlay Close Button 叠加关闭按钮

<a class="closeOverlayBtn" onclick="flashElement(<%=rsPhotoData.Fields("photoID")%>)">
x
</a>

Which as you can see allows me to call JS functions using my close button, the original one didn't easily allow this. 如您所见,这使我可以使用关闭按钮来调用JS函数,而最初的函数并不容易。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM