Ссылка fancybox перенаправляет браузер на путь к изображению

Я пытаюсь отобразить, что увеличивается в fancybox (2) при нажатии. Проблема в том, что при нажатии на изображение, хотя оно правильно отображается внутри fancybox, браузер уходит со страницы и переходит по ссылке, определенной в файле href. Как я могу предотвратить это?

<script type="text/javascript">
  $(document).ready(function() {
  $(".fancybox").fancybox({
    helpers :{
      title :{
         type : 'over'
      }
     }
   });
 });
</script>

<table>
  <tbody>
    <tr>
      <td>
        <a class="fancybox ui-link" title="My Image href="http://localhost/images/my_image.jpg"><img style="width:64px; height:64px;" src="images/my_image.jpg" alt=""></a>
      </td>
    </tr>
  </tbody>
</table>

jquery fancybox-2
person Shakur    schedule 25.02.2013    source источник
comment
проверьте, правильно ли вы закрываете свой атрибут title .. в конце title="My Image отсутствует кавычка ... также, когда вы говорите, что браузер уходит, означает ли это, что fancybox закрыт, а изображение открыто в окне браузера?   -  person JFK    schedule 26.02.2013
comment
fancybox остается открытым, но браузер следует за действием ссылки, поэтому в этом случае он переходит на localhost/images/my_image.jpg   -  person Shakur    schedule 26.02.2013
comment
так почему fancybox остается открытым? Вы можете поделиться какой-либо ссылкой или создать тестовую страницу, чтобы увидеть проблему. Не уверен, что я слежу за тобой.   -  person JFK    schedule 26.02.2013
comment
этот jsfidle jsfiddle.net/7b2WP/1 имитирует мою страницу. В моем случае, когда я нажимаю на изображение, fancybox появляется не поверх страницы, а поверх пустой страницы. то есть выполняет запрос GET к URL-адресу изображения   -  person Shakur    schedule 26.02.2013
comment
Я не уверен, что вы делаете неправильно, и, честно говоря, я не вижу, как я или кто-то другой может помочь. Я исправил основные синтаксические ошибки html в вашем jsfiddle jsfiddle.net/7b2WP/4, и fancybox работает как ожидал.   -  person JFK    schedule 26.02.2013

Ответы (2)


arrow_upward
1
arrow_downward

Я знаю, что уже поздно, но... может кому поможет.

У меня была та же проблема, и я понял, что мы использовали data-src вместо *href:

<a data-fancybox="image" data-src={{asset('uploads/sobre/'.$itemimage)}}"  data-caption="{{$item->title}}">
person LuizEduardoMPF    schedule 04.08.2020

arrow_upward
0
arrow_downward

Во-первых, в вашем html-коде отсутствует атрибут Title.

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

Например :

<a class="fancybox ui-link" title="My Image" href="images/my_image.jpg"><img style="width:64px; height:64px;" src="images/my_image.jpg" alt="" /></a>
person pistou    schedule 25.02.2013
comment
Вы пробовали без опции fancybox? Как $(a.fancybox).fancybox(); - person pistou; 25.02.2013