Question

灯箱会在弹出窗口中显示放大的图像，但没有其他显示。没有标题，没有导航和结束符号，没有创建帧的动画行为。我必须使用chrome的后退箭头才能返回原始图像。我在www.yurowcreates.com/Lville60中测试了Lightbox。（要查看，请使用标记为“ 5月3日”的选项卡，然后单击左上角的图片。）我也在使用Bootstrap。会不会有冲突？我已按照所有安装说明进行操作，包括提供导航符号的路径以及对HTML链接标签和javascript脚本标签的正确使用顺序。（请参见下文）

我的HTML标记如下：

在头部：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0- 
beta.2/css/bootstrap.min.css" integrity="sha384- 
PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" 
crossorigin="anonymous">
<link rel="stylesheet"   href="Style.css"    type="text/css">
<link rel="stylesheet" href="lightbox.css" type="text/css">

在正文部分；

 <div class="container">
  <div class="row mb-3">
    <div class="col">
    <a  href="images/sandyandstu.jpg" data-lightbox="sandyandstu" data-title="Sandy and Stu"><img class="mb-5 mb-sm-0" src="images/sandyandstu.jpg" width="300" height= "200"></a>
    </div>
    ...two other images in the same row go here...
  </div>

、、

 <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" 
 integrity="sha384- 
 KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" 
 crossorigin="anonymous"></script>

...（ajax和引导脚本）...

  <script src="lightbox.js"></script>     
  </body>

Answer 1

检查图像路径是否正确，并根据您的文件结构修改lightbox.css

灯箱2导航符号未出现

1 个答案: