I am very new to Javascript. I have been looking into using Javascript to edit css style properties. I have searched the web and looked at a lot of different problems. Even with all of that, it is probably my inexperience as to why I can’t figure out what is wrong with my code. What adds to the problem is that there are so many ways to do this. Anyway here are the specifics.
What I want it to do:
When someone clicks on the link in the code, I want the hidden DIV (which will just be near the top of my waiting to be called on) to have its visibility switched to visible so as to create a new layer on the page.
My code:
<html>
<head>
<script language="javascript">
function newwindow() {
var showme = document.getelementbyid("testing");
showme.style.visibility = "visible";
}
</script>
</head>
<body>
<a href="#" onclick="newwindow()">Show me my hidden layer</a>
<div id="testing" style="position: absolute; visibility: hidden; left: 50%; top: 50%;
border: 1px solid darkblue; width: 400px; height: 300px; line-height: 300px;
text-align: center; vertical-align: middle;
margin-top: -150px; margin-left: -200px; background: lightgray">HELLO!!!</div>
</body>
</html>
Now, I know there are a lot of ways to do this. But can someone show me what to tweak in the code I gave to make the way I am writing this work? Thanks so much for your time.
It is
document.getElementByIdnotdocument.getelementbyidWorking Demo