我正在创建一个图像上的地图链接，它有两个链接来打开视频和联系表单。我正在用lightbox弹出窗口，但它不工作。这是我的代码。。

HTML

<div class="map">
    <img src="http://www.gate7infotech.com/projects/development/MyLuckyBottle/wp-content/themes/twentythirteen/images/home_background.jpg"/>
    <a href="#pop-up-form" id="pop-up-form" shape="rect" coords="31,572,499,1028" class="a lightbox"><?php echo do_shortcode("[contact-form-7 id=\'4\' title=\'Registration Form\']"); ?></a>
    <a href="#" class="b"></a>
    <a href="#" class="c"></a>
</div>

CSS

div.map {
    position: relative;
}

div.map > img {
    display: block;
    max-width: 100%;
}

div.map > a {
    display: block;
    position: absolute;
}

div.map > a:hover {
    background-color: rgba(255, 0, 0, .5);
}

div.map > a.a {
    top: 0;
    left: 0;
    width: 50%;
    height: 50%;
}

div.map > a.b {
    top: 0;
    left: 50%;
    width: 20%;
    height: 50%;
}

div.map > a.c {
    bottom: 0;
    right: 0;
    width: 20%;
    height: 50%;
}

#pop-up-form { display: none; }