小编Juk*_*ker的帖子

为了训练我的网络开发技能,我克隆了一些页面,但每次有一个巨大的图像,我无法使其完全响应,它看起来在电话或当你减小屏幕尺寸时被破坏.今天我正在克隆这个页面:

https://500px.com/

正如你所看到的,这个网站是完全响应的,我的意思是如果我减少页面,无论如何它将是"好的".特别是这对夫妇在山上的第一个大图像,甚至文字都响应!

这是我的代码:

<!-- Jquery qui fait que le header devient blanc quand on scroll -->
$(window).on("scroll", function() {
    if($(window).scrollTop() > 10) {
        $("header").addClass("active");
    } else {
        //remove the background property so it comes transparent again (defined in your css)
       $("header").removeClass("active");
    }
});

body {
	margin: 0 auto;
	
}

header {
width: 100%;
height:40px;
background-color: transparent;
position: fixed;

}

.active { background-color: white;}

.all {
	display: flex;
	background-color: transparent;
}
.po {
	padding: 0 50px 0 50px;
}
.pa …

我想做一个简单的计时器,它可以从25运行到0并随时重置.

为此,我做了一个可点击的div,我想要一次点击启动计时器,另一个将它重置为25并停止计时器,这可能吗？可切换的启动/重置计时器？

这是我到目前为止提出的:

HTML

<div id="result" onclick="playReset"><p id="output"></p> </div>

CSS

#result {
  background: pink;
  height: 200px;
  width: 200px;
  border-radius: 50%;
  margin-left: 400px;
  margin-top: 200px;
}
#result:hover {
 border: black solid;

}
#output{
  margin-left: 70px;
position: fixed;
  font-size: 60px;
}

最重要的是JS:

var duree=25;
var toggle = true;
function playReset () {


if(toggle == true) {
 var time = setInterval(function(){ 
  duree--;

document.getElementById('output').innerHTML = duree;                   
                      }, 1000);

  toggle = false
}
else if (toggle == false) {
  clearInterval(time);
  duree = 25;
  toggle = …