неопределенная переменная javascript - лайтбокс - PullRequest
Новая
       6

неопределенная переменная javascript - лайтбокс

0 голосов
/ 24 сентября 2011

я пытаюсь открыть лайтбокс при загрузке веб-страниц с использованием библиотеки javascript "lytebox"

вот мой код 

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript" language="javascript" src="lytebox.js"></script>
<link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />

<script>
    function ShowIntro()
    {
        $lb.launch('example.jpg','showPrint:true','Orion Nebula','This is my description, which is optional');
    }
</script>

</head>


<body onLoad="ShowIntro()">
</body>
</html>

код отлично работает на Firefox и Chrome, но в Internet Explorer 8 он не работает, и я получаю следующую ошибку: 

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; .NET4.0E)
Timestamp: Sat, 24 Sep 2011 05:10:04 UTC


Message: '$lb' is undefined
Line: 12
Char: 3
Code: 0
URI: file:///C:/Users/User/Desktop/lytebox_v5.1/lytebox.html

Как я могу это исправить?

p.s. Я использую lytebox, потому что он не требует jquery, и я не хочу, чтобы конфликты с другими частями на моей странице (например, "videolightbox")

1 Ответ

2 голосов
/ 24 сентября 2011

Вот предположение: Lytebox использует window.onload для настройки переменной $lb (вы можете увидеть это в самом конце сценария ), а когда вы делаете <body onload"..."> вы в основном заглушаете функцию Lytebox window.onload до того, как у нее появится шанс выстрелить. Вот другой SO вопрос , который, кажется, подтверждает это поведение в IE.

Итак, как добавить событие onload, когда Lytebox нуждается в собственном? Саймон Уиллисон на самом деле предложил решение семь лет назад в довольно классической статье . В вашем случае его совет прост для реализации: 

<body><!-- no onload --->
  <script>
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = ShowIntro;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      ShowIntro();
    }
  }
  </script>
</body>
...