Hello everyone I am trying to change width and height of my div element with Javascript, when user insert values, I want to change size automatically so here is what I tried:
<br><p>chose button color</p>
<a href="#" onclick="redBtn()">red</a>
<a href="#" onclick="blueBtn()">blue</a>
<a href="#" onclick="greenBtn()">Green</a>
<a href="#" onclick="yellowBtn()">Yellow</a>
<a href="#" onclick="whiteBtn()">White</a><br>
OR type your own: <input type="text" id="ownBtn"> <button onclick="submitBtn();" href="javascript:;">Submit</button><br>
Type your width: <input type="text" id="userWidth"><button onclick="submitWidth()" href="javascript:;">Submit Width</button> </input><br>
<div class="div1" id="div1" class="class1">
<div class="div2" id="div3">
<a href="https://calendly.com/dumbomoving">
</a>
</div>
</div>
<script>
function submitWidth() {
var userWidth = document.getElementById();
document.getElementById("div2").style.width = userWidth.value + "px";
}
function submitBtn()
{
var userBack = document.getElementById('ownBtn');
document.getElementById("btn1").style.backgroundColor =ownBtn.value;
}
</script>
So for button color is ok, but for width is not! So does someone have some idea how to do this?
You wrote
document.getElementById("div2")
But I see no element with id div2
in your HTML.
You did
<div class="div2" id="div3">
But you probably wanted to write
<div class="div2" id="div2">
After all, all your javascript is really weird. Maybe try this :
function submitWidth() {
var userWidth = document.getElementById("userWidth");
userWidth.style.width = userWidth.value + "px";
}
It was very stupid mistake
function submitWidth() {
var userWidth = document.getElementById('userWidth');
document.getElementById("div2").style.width = userWidth.value + "px";
}
I forgot to put in getElement. 放在getElement中。 Bu now I have problem, my picture in div doesn't want to resize. So if someone have advice it is welcome.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.