Проблема видимости Fancybox - PullRequest
1 голос
/ 06 июля 2010

При установке стиля на # inline2, скрывающем его, Fancybox будет пустым при щелчке. Кроме того, элемент # inline2 можно увидеть в Fancybox, когда нет стиля, скрывающего его. Хотя этот пример скопирован непосредственно из различных примеров на официальном сайте Fancybox. См. Различные примеры на http://fancybox.net/home.

Кто-то, пожалуйста, просветите меня и скажите, что я делаю не так! Я, очевидно, хочу, чтобы элемент # inline2 отображался в Fancybox, а не как обычная часть моей страницы.

Заранее спасибо

/ Парень потратил часы на то, что должно быть легкой работой!

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html lang="da">
    <head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8">
 <link type="text/css" href="/css/jquery.fancybox-1.3.1.css" rel="stylesheet" />
 <script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script>
 <script type="text/javascript" src="/js/jquery.fancybox-1.3.1.js"></script>
 <script type="text/javascript">
 jQuery(document).ready(function() {
  $("#various2").fancybox({
   'modal' : true,
   'transitionIn' : 'fade',
   'transitionOut' : 'fade'
  });
 });
 </script>
    </head>
    <body>

    <a id="various2" href="#inline2">Inline - modal window</a>
    <div id="inline2" style="display:none;">
 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a></p>
    </div>

    </body>
    </html>

Ответы [ 2 ]

2 голосов
/ 06 июля 2010

Когда я смотрю на этот пример , становится очевидным, что вы должны указать href элемента привязки на div в другом с style="display:none"(см. # 4), поэтому вы не должны помещать фактическое содержимое в div с display:none, в противном случае содержимое останется скрытым (как вы можете видеть в Firebug).

Измените свой код на

<div style="display:none"><div id="inline2">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. &nbsp;&nbsp;</p>
</div></div>

Кстати, на вашей странице есть некоторые ошибки, такие как закрывающий тег </a> в #inline2 и некоторые другие.Когда ваша страница отображается с использованием синтаксического анализатора XML, ваши пользователи увидят только (возможно, желтую) страницу с ошибкой.

1 голос
/ 06 июля 2010

Присвоить идентификатор inline2 элементу p

<div style="display:none;">
    <p id="inline2">Lorem ipsum dolor sit amet, consectetur 
        adipiscing elit. &nbsp;&nbsp;</p>
</div>

Если вы хотите, чтобы ваш XHTML также проверял, вам нужно

  • Изменить <html lang="da"> на<html lang="da" xmlns="http://www.w3.org/1999/xhtml">.
  • Правильно закройте мета-элемент />.
  • Добавьте заголовок для вашего документа.
  • Заключите гиперссылку в элемент блока.
  • Удалите лишние </a> из вашего p элемента.
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...