0

我的 Weebly.com 网站上有一些 JavaScript。一种是 Tubular,它为所选元素添加视频背景。但它并不总是正确加载并且并不总是运行。有时会,通常不是在刷新时,而是在我在 Chrome 中打开一个新窗口并加载网站时。

JavaScript 不总是被加载和运行的原因是什么?

  • 管状代码和演示(虽然适用于 JSFiddle):JSFiddle

我在按 CTRL+SHIFT+J 时在 Chrome 中看到的内容。

Calling CSSStyleSheet.insertRule() with one argument is deprecated. Please pass the index argument as well: insertRule(x, 0).

Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query expression: only screen and (-webkit-min-device-pixel-ratio: 2), not all, not all, not all, only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) (index):1

Consider using 'dppx' units instead of 'dpi', as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen. In media query expression: only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) (index):1

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('http://www.youtube.com') does not match the recipient window's origin ('https://www.youtube.com').

event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('http://www.youtube.com') does not match the recipient window's origin ('https://www.youtube.com').

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('http://www.youtube.com') does not match the recipient window's origin ('https://www.youtube.com'). www-widgetapi-vflZ5Tu3E.js:26

我在外部文件上的脚本加载顺序就在结束正文标记之前,在其余脚本之上。

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="/files/theme/jquery_tubular.js"></script>
<script type="text/javascript" src="/files/theme/smoothscroll.js"></script>
<script type="text/javascript" src="/files/theme/bigtext.js"></script> 

这是我的 HTML 文件中调用视频的脚本。Tubular 代码在 jquery_tubular.js 中。请参阅上面 JSFiddle 链接中的代码。

<script type="text/javascript"> 
        jQuery().ready(function() {
        jQuery('#video-bg').tubular({videoId: 'a2pu_xhBnzY’});
        }); 
</script> 
4

1 回答 1

0

“这个问题(我相信)与 YT api 没有触发其就绪事件有关。”

只需在 setTimeout 函数中更改 window.onYouTubeIframeAPIReady = function()

window.onYouTubeIframeAPIReady = function() {
     setTimeout(function(){
        player = new YT.Player('tubular-player', {
            width: options.width,
            height: Math.ceil(options.width / options.ratio),
            videoId: options.videoId,
            playerVars: {
                controls: 0,
                showinfo: 0,
                modestbranding: 1,
                wmode: 'transparent'
            },
            events: {
                'onReady': onPlayerReady,
                'onStateChange': onPlayerStateChange
            }
        });
    },600);
  };

我在这里找到了解决方案: https ://code.google.com/p/jquery-tubular/issues/detail?id=31

于 2015-04-13T19:06:38.687 回答