小编fox*_*xer的帖子

使用 JavaScript 在浏览器中进入和退出全屏

我正在使用 Chrome,我想要一个简单的任务。使用代码退出全屏,而不是F11按键。

以下是一些有关如何实现它的文档:

以上方法均无效。Stack Overflow 上还有很多无效的答案。请帮忙,我真的需要解决这个问题。


这是CodePen

这是我的代码:

const button = document.getElementById('exitId');
button.addEventListener("click", function(){
  // JavaScript Code To Exit Fullscreen Goes Here
  if (document.exitFullscreen) {
    document.exitFullscreen();
  } else if (document.mozCancelFullScreen) { /* Firefox */
    document.mozCancelFullScreen();
  } else if (document.webkitExitFullscreen) { /* Chrome, Safari and Opera */
    document.webkitExitFullscreen();
  } else if (document.msExitFullscreen) { /* IE/Edge */
    document.msExitFullscreen();
  }
  
});
Run Code Online (Sandbox Code Playgroud)
<button id="exitId">Exit Fullscreen</button>  
Run Code Online (Sandbox Code Playgroud)

javascript google-chrome

8
推荐指数
2
解决办法
4882
查看次数

动态添加图像到这个美丽的框架

这是纯 CSS 中精美的动画边框。

如果我们想要这个动画边框作为一个框架并添加一个图像作为其中的内容怎么办。

当我添加图像时,它只是覆盖了框架,但我想将图像放在框架内,而不是放在框架上。

我已经尽力了,但没有人手我找不到解决办法。

这是我尝试过的(我需要使用 javascript 动态添加图像):

//addimage(); // uncomment this to add the image to the frame
function addimage(){
  
let pictureSource = 'https://www.architectureartdesigns.com/wp-content/uploads/2013/03/ArchitectureArtdesigns-8.jpg';

let image = document.createElement('img');
image.setAttribute("id", "shot");
var node = document.getElementsByClassName('content');
node[0].appendChild(image);
image.src = `${pictureSource}`;
let shot = document.getElementById("shot");

}
Run Code Online (Sandbox Code Playgroud)
html,
body,
.box .content {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: black;
}

.box {
	width: 300px;
	height: 300px;
	box-sizing: border-box;
	padding: 15px;
	position: relative;
	overflow: hidden;
}

.box::before {
	content: ''; …
Run Code Online (Sandbox Code Playgroud)

html javascript css

5
推荐指数
0
解决办法
155
查看次数

如果我们不等待承诺会发生什么

我有这个使用给定源播放音频的功能,它工作正常:

function sfxPlay(source) {
  let sfxAudio = new Audio(`${source}`);
  sfxAudio.crossOrigin = "anonymous";
  sfxAudio.play();

  return new Promise((resolve) => {
    sfxAudio.addEventListener("ended", function () {
      sfxAudio.currentTime = 0;
      resolve();
    });
  });
}
Run Code Online (Sandbox Code Playgroud)

我将在这样的异步函数中使用它:

await sfxPlay(source.mp3);
Run Code Online (Sandbox Code Playgroud)

问题是如果我想在没有await? 如果稍后我再次将它与 await 一起使用,这是否会产生任何错误......当我们不等待它时,那个承诺会发生什么?!

编辑: 我的意思是如果我们在函数 A 中有这样的函数:

sfxPlay(source.mp3);
Run Code Online (Sandbox Code Playgroud)

像这样在函数 B 中使用它是否可以接受?

await sfxPlay(source.mp3);
Run Code Online (Sandbox Code Playgroud)

javascript

4
推荐指数
2
解决办法
1026
查看次数

将数组元素的值与前一个元素的值相加

我需要有人将数组元素的值与前一个元素相加并返回一个新数组。

所以如果我们有:

let durations = [4, 3.5, 6];
Run Code Online (Sandbox Code Playgroud)

那么在新数组中,第一个元素是 4,第二个元素是 的总和4 + 3.5第三个元素4 + 3.5 + 6; 所以期望的结果是[4, 7.5, 13.5]

到目前为止,似乎意外地减少了只是连接数字并返回一个字符串数组!

let durations = [4, 3.5, 6];
Run Code Online (Sandbox Code Playgroud)

javascript

3
推荐指数
1
解决办法
989
查看次数

检查字符串是否包含完全匹配

我想检查字符串是否(let entry)包含与以下内容完全匹配let expect

let expect = 'i was sent'
let entry = 'i was sente to earth' // should return false
// let entry = 'to earth i was sent' should return true

// includes() using the first instance of the entry returns true
if(entry.includes(expect)){
console.log('exact match')

} else {
console.log('no matches')

}
Run Code Online (Sandbox Code Playgroud)

StackOverflow 上有很多答案,但我找不到可行的解决方案。

笔记:

let expect = 'i was sent' 
let entry = 'to earth i was sent'
Run Code Online (Sandbox Code Playgroud)

应该返回 true

let expect = 'i …
Run Code Online (Sandbox Code Playgroud)

javascript

3
推荐指数
1
解决办法
1万
查看次数

标签 统计

javascript ×5

css ×1

google-chrome ×1

html ×1