Question

FancyBox3文档说明以下html代码可用于嵌入视频。

<output>

它会打开方框，但会显示一个Chrome错误页面，上面写着“它可能已被移动或删除”。 Fancybox3正在运行，因为其他iframe正确加载。我甚至可以复制YouTube嵌入链接（不是视频网址）并使用它，如下所示，它可以工作。但是，我无法将const divs = document.querySelectorAll( "div" ), outer_div = divs[ 0 ], outer_div_styles = window.getComputedStyle( outer_div ), inner_div_styles = window.getComputedStyle( divs[ 1 ] ), outer_div_width = parseInt( outer_div_styles.width ), outer_div_height = parseInt( outer_div_styles.height ), dimention_ratio = { x: parseInt( inner_div_styles.width ) / outer_div_width, y: parseInt( inner_div_styles.height ) / outer_div_height }, half_odw = outer_div_width / 2, half_odh = outer_div_height / 2, expandCoords = function( e ) { // sometimes useful, never harmful var X = e.pageX, Y = e.pageY; if ( X < half_odw ) { X -= 1; } else if ( X > half_odw ) { X += 1; } if ( Y < half_odh ) { Y -= 1; } else if ( Y > half_odh ) { Y += 1; } return { x: X, y: Y }; }, // for demo convenience output = document.querySelector( "output" ); outer_div.addEventListener( "mousemove", function( evt ) { evt = expandCoords( evt ); // for demo convenience output.innerHTML = "Coords: x:" + evt.x + ", y:" + evt.y + "<br>" + "scrollLeft = " + ( evt.x * dimention_ratio.x ) + "<br>" + "scrollTop = " + ( evt.y * dimention_ratio.y ); outer_div.scrollLeft = evt.x * dimention_ratio.x; outer_div.scrollTop = evt.y * dimention_ratio.y; }, false );等选项添加到嵌入网址中，或者将其分解。

body {
  overflow: hidden;
  margin: 0;
}
.outer {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
.inner {
  width: 1000vw; /* 10 times the width of its parent */
  height: 500vh; /* 5 times the height of its parent */
  box-shadow: inset 0 0 20px 20px green; /* no border edge highlight */
  background: radial-gradient( white, black );
}

/* for demo convenience */
output {
  position: absolute;
  top: 10vh;
  left: 10vw;
  font-family: Consolas, monospace;
  background: white;
  padding: .2em .4em .3em;
  cursor: default;
}

我在本地工作。这只是本地嵌入的fancybox的一个问题，它应该在网络上运行吗？

FancyBox3 YouTube嵌入代码不显示

0 个答案: