Javascript <；部门>；否决其他<；部门>'；s_Javascript_Jquery_Css_Html

Javascript <；部门>；否决其他<；部门>'；s

javascript jquery css html

Javascript <；部门>；否决其他<；部门>'；s,javascript,jquery,css,html,Javascript,Jquery,Css,Html,我正在用CSS模板构建我的网站，在网格中我想使用免费的lightbox“HTML5 lightbox”。然而，当我点击任何一个lightbox时，它似乎被我的第一个lightbox/div否决了这让我头痛不已，因为我或多或少是HTML的初学者，我不知道代码中的错误可能在哪里图像显示正确，p class=“imgtext”也显示正确，但是，当我单击第二张图像时，我得到了网站1的灯箱以下是前两个柱的片段，其中包含相应的灯箱： <div class="container main">

我正在用CSS模板构建我的网站，在网格中我想使用免费的lightbox“HTML5 lightbox”。然而，当我点击任何一个lightbox时，它似乎被我的第一个lightbox/div否决了

这让我头痛不已，因为我或多或少是HTML的初学者，我不知道代码中的错误可能在哪里

图像显示正确，p class=“imgtext”也显示正确，但是，当我单击第二张图像时，我得到了网站1的灯箱

以下是前两个柱的片段，其中包含相应的灯箱：

<div class="container main">
<div class="row">

    <div class="four columns portfolio">
        <div id="mydiv" style="display:none;">
            <div class="lightboxcontainer">
                <div class="lightboxleft">
                    <div class="divtext">
                        <p class="divtitle" style="font-size:16px;font-weight:bold;margin:12px 0px;">Website 1</p>
                        <p class="divdescription" style="font-size:14px;line-height:20px;">xxxWonderPlugin Gallery is a WordPress photo and video gallery plugin, and a great way to showcase your images and videos online. The plugin supports images, YouTube, Vimeo, Dailymotion, mp4 and webm videos. It's fully responsive, works on iPhone, iPad, Android, Firefox, Chrome, Safari, Opera and Internet Explorer 7/8/9/10/11.</p>
                    </div>
                </div>
                <div class="lightboxright">
                    <iframe width="100%" height="100%" src="https://www.youtube.com/embed/wswxQ3mhwqQ" frameborder="0" allowfullscreen></iframe>
                </div>
                <div style="clear:both;"></div>
            </div>
        </div>

        <a href="#mydiv" class="html5lightbox" data-width="800" data-height="400" >        
        <div href="#mydiv" class="html5lightbox" data-width="800" data-height="400" id="imagelist">
            <a href="#">
                <img class="grid" src="images/rven.jpg"  />
                <p class="imgtext">
                <span>
                    <span>Website 1</span>
                </span>
                </p>
            </a>
        </div>
        </a>
    </div><!-- End of element-->

    <div class="four columns portfolio">
        <div id="mydiv" style="display:none;">
            <div class="lightboxcontainer">
                <div class="lightboxleft">
                    <div class="divtext">
                        <p class="divtitle" style="font-size:16px;font-weight:bold;margin:12px 0px;">Website 2</p>
                        <p class="divdescription" style="font-size:14px;line-height:20px;">WonderPlugin Gallery is a WordPress photo and video gallery plugin, and a great way to showcase your images and videos online. The plugin supports images, YouTube, Vimeo, Dailymotion, mp4 and webm videos. It's fully responsive, works on iPhone, iPad, Android, Firefox, Chrome, Safari, Opera and Internet Explorer 7/8/9/10/11.</p>
                    </div>
                </div>
                    <div class="lightboxright">
                        <iframe width="100%" height="100%" src="https://www.youtube.com/embed/wswxQ3mhwqQ" frameborder="0" allowfullscreen></iframe>
                    </div>
                <div style="clear:both;"></div>
            </div>
        </div>

        <a href="#mydiv" class="html5lightbox" data-width="800" data-height="400" >        
        <div href="#mydiv" class="html5lightbox" data-width="800" data-height="400" id="imagelist">
            <a href="#">
                <img src="images/sortelunger.jpg"  />
                <p class="imgtext">
                <span>
                    <span>Website 2</span>
                </span>
                </p>
            </a>
        </div>
        </a>
    </div><!-- End of element-->
</div>


网站1
xxxWonderPlugin图库是WordPress照片和视频图库插件，是在线展示图像和视频的绝佳方式。该插件支持图像、YouTube、Vimeo、Dailymotion、mp4和webm视频。它的响应速度非常快，适用于iPhone、iPad、Android、Firefox、Chrome、Safari、Opera和Internet Explorer 7/8/9/10/11
网站2
WonderPlugin Gallery是WordPress照片和视频库插件，是在线展示图像和视频的绝佳方式。该插件支持图像、YouTube、Vimeo、Dailymotion、mp4和webm视频。它的响应速度非常快，适用于iPhone、iPad、Android、Firefox、Chrome、Safari、Opera和Internet Explorer 7/8/9/10/11

如果有人有任何想法，或者能为我指出正确的方向，我将不胜感激

亲切问候,，

弗雷德里克

在闲逛了一段时间后，我自己想出来了

问题是我一直在引用div id“mydiv”。如果我将第一个div id设置为“mydiv1”，并将href设置为mydiv1，它将自动选择正确的div

以下是带有正确id的代码：

<div class="container main">
<div class="row">

<div class="four columns portfolio">
    <div id="mydiv1" style="display:none;">
        <div class="lightboxcontainer">
            <div class="lightboxleft">
                <div class="divtext">
                    <p class="divtitle" style="font-size:16px;font-weight:bold;margin:12px 0px;">Website 1</p>
                    <p class="divdescription" style="font-size:14px;line-height:20px;">xxxWonderPlugin Gallery is a WordPress photo and video gallery plugin, and a great way to showcase your images and videos online. The plugin supports images, YouTube, Vimeo, Dailymotion, mp4 and webm videos. It's fully responsive, works on iPhone, iPad, Android, Firefox, Chrome, Safari, Opera and Internet Explorer 7/8/9/10/11.</p>
                </div>
            </div>
            <div class="lightboxright">
                <iframe width="100%" height="100%" src="https://www.youtube.com/embed/wswxQ3mhwqQ" frameborder="0" allowfullscreen></iframe>
            </div>
            <div style="clear:both;"></div>
        </div>
    </div>

    <a href="#mydiv1" class="html5lightbox" data-width="800" data-height="400" >        
    <div href="#mydiv1" class="html5lightbox" data-width="800" data-height="400" id="imagelist">
        <a href="#">
            <img class="grid" src="images/rven.jpg"  />
            <p class="imgtext">
            <span>
                <span>Website 1</span>
            </span>
            </p>
        </a>
    </div>
    </a>
</div><!-- End of element-->

<div class="four columns portfolio">
    <div id="mydiv2" style="display:none;">
        <div class="lightboxcontainer">
            <div class="lightboxleft">
                <div class="divtext">
                    <p class="divtitle" style="font-size:16px;font-weight:bold;margin:12px 0px;">Website 2</p>
                    <p class="divdescription" style="font-size:14px;line-height:20px;">WonderPlugin Gallery is a WordPress photo and video gallery plugin, and a great way to showcase your images and videos online. The plugin supports images, YouTube, Vimeo, Dailymotion, mp4 and webm videos. It's fully responsive, works on iPhone, iPad, Android, Firefox, Chrome, Safari, Opera and Internet Explorer 7/8/9/10/11.</p>
                </div>
            </div>
                <div class="lightboxright">
                    <iframe width="100%" height="100%" src="https://www.youtube.com/embed/wswxQ3mhwqQ" frameborder="0" allowfullscreen></iframe>
                </div>
            <div style="clear:both;"></div>
        </div>
    </div>

    <a href="#mydiv2" class="html5lightbox" data-width="800" data-height="400" >        
    <div href="#mydiv2" class="html5lightbox" data-width="800" data-height="400" id="imagelist">
        <a href="#">
            <img src="images/sortelunger.jpg"  />
            <p class="imgtext">
            <span>
                <span>Website 2</span>
            </span>
            </p>
        </a>
    </div>
    </a>
</div><!-- End of element-->


网站1
xxxWonderPlugin图库是WordPress照片和视频图库插件，是在线展示图像和视频的绝佳方式。该插件支持图像、YouTube、Vimeo、Dailymotion、mp4和webm视频。它的响应速度非常快，适用于iPhone、iPad、Android、Firefox、Chrome、Safari、Opera和Internet Explorer 7/8/9/10/11
网站2
WonderPlugin Gallery是WordPress照片和视频库插件，是在线展示图像和视频的绝佳方式。该插件支持图像、YouTube、Vimeo、Dailymotion、mp4和webm视频。它的响应速度非常快，适用于iPhone、iPad、Android、Firefox、Chrome、Safari、Opera和Internet Explorer 7/8/9/10/11

在闲逛了一段时间后，我自己想出来了

问题是我一直在引用div id“mydiv”。如果我将第一个div id设置为“mydiv1”，并将href设置为mydiv1，它将自动选择正确的div

以下是带有正确id的代码：

<div class="container main">
<div class="row">

<div class="four columns portfolio">
    <div id="mydiv1" style="display:none;">
        <div class="lightboxcontainer">
            <div class="lightboxleft">
                <div class="divtext">
                    <p class="divtitle" style="font-size:16px;font-weight:bold;margin:12px 0px;">Website 1</p>
                    <p class="divdescription" style="font-size:14px;line-height:20px;">xxxWonderPlugin Gallery is a WordPress photo and video gallery plugin, and a great way to showcase your images and videos online. The plugin supports images, YouTube, Vimeo, Dailymotion, mp4 and webm videos. It's fully responsive, works on iPhone, iPad, Android, Firefox, Chrome, Safari, Opera and Internet Explorer 7/8/9/10/11.</p>
                </div>
            </div>
            <div class="lightboxright">
                <iframe width="100%" height="100%" src="https://www.youtube.com/embed/wswxQ3mhwqQ" frameborder="0" allowfullscreen></iframe>
            </div>
            <div style="clear:both;"></div>
        </div>
    </div>

    <a href="#mydiv1" class="html5lightbox" data-width="800" data-height="400" >        
    <div href="#mydiv1" class="html5lightbox" data-width="800" data-height="400" id="imagelist">
        <a href="#">
            <img class="grid" src="images/rven.jpg"  />
            <p class="imgtext">
            <span>
                <span>Website 1</span>
            </span>
            </p>
        </a>
    </div>
    </a>
</div><!-- End of element-->

<div class="four columns portfolio">
    <div id="mydiv2" style="display:none;">
        <div class="lightboxcontainer">
            <div class="lightboxleft">
                <div class="divtext">
                    <p class="divtitle" style="font-size:16px;font-weight:bold;margin:12px 0px;">Website 2</p>
                    <p class="divdescription" style="font-size:14px;line-height:20px;">WonderPlugin Gallery is a WordPress photo and video gallery plugin, and a great way to showcase your images and videos online. The plugin supports images, YouTube, Vimeo, Dailymotion, mp4 and webm videos. It's fully responsive, works on iPhone, iPad, Android, Firefox, Chrome, Safari, Opera and Internet Explorer 7/8/9/10/11.</p>
                </div>
            </div>
                <div class="lightboxright">
                    <iframe width="100%" height="100%" src="https://www.youtube.com/embed/wswxQ3mhwqQ" frameborder="0" allowfullscreen></iframe>
                </div>
            <div style="clear:both;"></div>
        </div>
    </div>

    <a href="#mydiv2" class="html5lightbox" data-width="800" data-height="400" >        
    <div href="#mydiv2" class="html5lightbox" data-width="800" data-height="400" id="imagelist">
        <a href="#">
            <img src="images/sortelunger.jpg"  />
            <p class="imgtext">
            <span>
                <span>Website 2</span>
            </span>
            </p>
        </a>
    </div>
    </a>
</div><!-- End of element-->


网站1
xxxWonderPlugin图库是WordPress照片和视频图库插件，是在线展示图像和视频的绝佳方式。该插件支持图像、YouTube、Vimeo、Dailymotion、mp4和webm视频。它的响应速度非常快，适用于iPhone、iPad、Android、Firefox、Chrome、Safari、Opera和Internet Explorer 7/8/9/10/11
网站2
WonderPlugin Gallery是WordPress照片和视频库插件，是在线展示图像和视频的绝佳方式。该插件支持图像、YouTube、Vimeo、Dailymotion、mp4和webm视频。它的响应速度非常快，适用于iPhone、iPad、Android、Firefox、Chrome、Safari、Opera和Internet Explorer 7/8/9/10/11

一旦我在modal:z-index:1151上设置了高z-index，我的引导弹出窗口和引导datetimepicker中也有类似的内容被否决！重要的；它能按要求工作对不起，我