fancybox сначала загружается под иконками моей страницы и безумно увеличивается - PullRequest
1 голос
/ 04 июня 2019

Когда я нажимаю на одну из моих миниатюр, загружается и открывается fancybox, но индекс моей галереи стоит на полпути на моей странице. В самом низу моего веб-сайта я получаю значки fancybox, размер полной ширины моего экрана, затем увеличенные миниатюры и изображение с этим индексом.

Это код, который я использую:

$(document).ready(function() {
  $('.fancybox').fancybox();
});
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="CSS/normalize.css" rel="stylesheet" type="text/css">
<link href="CSS/ResponsiveWebsite.css" rel="stylesheet" type="text/css">
<link rel="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="JS/navigatiebalk.js"></script>
<script type="text/javascript" src="JS/Mole-park.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js"></script>

//...
<div class="row">
  <div class="col-8 col-l-8 img-container">
    <div>
      <a class="fancybox" data-fancybox="gallery" rel="group1" href="images/antelope.jpg"><img src="images/thumbnails/antelope_tn.jpg" alt="" /></a>
      <a class="fancybox" data-fancybox="gallery" rel="group1" href="images/elephant.jpg"><img src="images/thumbnails/elephant_tn.jpg" alt="" /></a>
    </div>
  </div>
  <aside class="col-4 col-l-4 clearfix">
    <h2>Visiting the park</h2>
    //...

пример одного из значков на моем экране

1 Ответ

0 голосов
/ 05 июня 2019

Подобные проблемы означают, что файл CSS загружен неправильно. В вашем случае вы забыли добавить type="text/css" к ссылке на файл CSS.

...