如何在javascript或jquery中设置html元素的百分比位置
如何在javascript或jquery中设置html元素的百分比位置
提问于 2018-08-16 02:49:22
我正在尝试将div的位置设置为身体的100%右侧。无论如何，它需要在JavaScript(或jQuery)中完成。
这就是我想象的代码的样子...
const div = document.getElementById("div");
div.style.right = 100 + "%";我将非常感谢您提供的任何信息或文档供我研究。为了澄清，我想把一个div移到身体的右边，但我想用javaScript的百分比来做。
回答 1
Stack Overflow用户
发布于 2018-08-16 02:51:26
您正在寻找将width CSS属性设置为100%。
const div = document.getElementById("div");
div.style.width = "100%";<div id="div" style="border: 1px solid black;"></div>
但是，对于div标记，没有必要显式地将其宽度设为100%，因为它是一个block level element (具有display: block)，并且将自动继承其父标记的宽度。
对于进度条，您只需在开始时将其宽度设置为0%，然后使用setInterval逐渐增加width。参考：https://www.w3schools.com/howto/howto_js_progressbar.asp
.progress {
width: 100%;
background-color: #ddd;
}
.bar {
width: 0%;
height: 20px;
background-color: #4CAF50;
}<div class="progress">
<div class="bar"></div>
</div>
<p/>
<button onClick="run()">Start</button>
<script>
var bar = document.querySelector('.bar');
function run(){
var width = 0;
var intvl = setInterval(function(){
width ++
bar.style.width = width + "%";
if(width>=100){
clearInterval(intvl);
}
}, 10);
}
</script>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51864684
复制相关文章
相似问题