如何向jquery Lightbox添加关闭按钮? [英] How to add a close button to jquery Lightbox?

查看:157
本文介绍了如何向jquery Lightbox添加关闭按钮?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我最近制作了一个灯箱,我想为其添加一个关闭按钮。这是我有:

I recently made a Lightbox and I want to add a close button to it. Here is what I have:

    <style>
        .black_overlay{
            display: none;
            position: absolute;
            top: 0%;
            left: 0%;
            width: 100%;
            height: 100%;
            background-color: black;
            z-index:1001;
            -moz-opacity: 0.8;
            opacity:.80;
            filter: alpha(opacity=80);
        }


        .white_content {
        width:600px;
        height:560px;
        padding: 16px;
         top: 5%;
         left: 25%;
         position: absolute;
         display: none;
        -webkit-border-radius: 20px;
        -moz-border-radius: 20px;
        border-radius: 20px;
        border:2px solid #FFFFFF;
        background-color:#FFFFFF;
        -webkit-box-shadow: #C9C9C9 8px 8px 8px;
        -moz-box-shadow: #C9C9C9 8px 8px 8px;
        box-shadow: #C9C9C9 8px 8px 8px;
        z-index:1002;
        overflow: auto;

    </style>
    </head>
    <body>
        <p><a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">here.................................................................................................</a></p>
        <div id="light" class="white_content"><center><img src="http://theamazingmonth.pusku.com/files/Help.png">
<br>
<!--- Text for Help.</--->
<p align="left">
<div class="tilt pic">
    <img src="http://theamazingmonth.pusku.com/clues/Envelope.png" height="114" width="193" alt="">
  </div>

<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">x</a></div>
        <div id="fade" class="black_overlay"></div>
    </body>
</html> 

如何在弹出窗口的顶角添加关闭按钮?

How can I add a close button to the top corner of the popup window?

推荐答案

上添加类关闭 c $ c>标记,并将其放入< div> 标记。

Add class close on <a> tag and put into <div> tag, content too.

<div id="light" class="white_content">
    <div class="white-header>"
        <a class="close" href="javascript:void(0)" onclick="document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">x</a>
    </div>

    <div class="white-body">
    content here
    </div>
</div>

在类 .white_content $ c> overflow:auto;

On class .white_content remove overflow: auto;

/ fauzi / 3zYTs / 3 / embedded / result /rel =nofollow> jsfiddle , edit jsfiddle

I have made it, you can see on jsfiddle , edit jsfiddle

这篇关于如何向jquery Lightbox添加关闭按钮?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆