JQuery Fancybox показывает крошечный - PullRequest
Новая
       3

JQuery Fancybox показывает крошечный

0 голосов
/ 14 декабря 2011

Я полностью сбит с толку. Я сократил это до самого простого случая и пропустил его через W3c-валидатор , и я все еще получаю это маленькое окно Fancybox. Я использовал Fancybox много-много раз. Выглядит так:

enter image description here

Страница находится здесь: http://www.ericaspindler.com/private/

В коде были удалены все другие JS и CSS, чтобы найти помехи.

Весь документ: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Erica Spindler | Author</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<script src="http://code.jquery.com/jquery-latest.js"  type="text/javascript"></script>
<script type="text/javascript" src="../js/fancybox_new/jquery.fancybox-1.3.1.js"></script> 
<link rel="stylesheet" type="text/css" href="../js/fancybox_new/jquery.fancybox-1.3.1.css" media="screen" /> 

<script type="text/javascript">
  $(document).ready(function(){     
    $("#infolink").fancybox({});
     $("#infolink").click();
  });

</script>

</head>
<body>

<div id="fancy" style="display:none;">
<div style="width:500px; height:500px">
<img src="../g/video_Faulkner_Society_300.jpg" width="300" height="243" alt="" />
</div></div>
<a id="infolink" href="#fancy" class="infolink" style="display:none"></a>

</body>
</html>

Исходное HTML-содержимое #fancy div было уменьшено до этого одного изображения в попытке прояснить.

Также удалены параметры, которые я инициализировал: 

  $(".infolink").fancybox({
    'scrolling'     : 'no',
    'titleShow'     : false,
    'overlayOpacity' : '0.7'
  });

Может кто-нибудь сказать мне мою ошибку?

Ответы [ 2 ]

5 голосов
/ 14 декабря 2011

display: none должен быть установлен на родительском делении того, который вы хотите использовать как бокс См. # 4 (встроенный контент) в документации .

Итак, переместите id="fancy" в дочерний элемент div следующим образом: 

<div style="display:none;">
  <div style="width:500px; height:500px" id="fancy">

ЗДЕСЬ является примером.

0 голосов
/ 14 декабря 2011

Я не знаю, поможет ли это, но ваш jQuery не очень хорошо написан. 

$(document).ready(function(){     
  $("#infolink").fancybox();
});

Дайте мне знать, если это вообще поможет, если нет, я продолжу изучать это.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...