seany123 Posted September 29, 2011 Share Posted September 29, 2011 Im not sure if this is a CSS or Javascript problem but basically i want to change the visibilty of a DIV id or class from hidden to visible. This is my current Html code: <html> <head> <link rel="stylesheet" type="text/css" href="css/main.css" media="all" /> </head> <body> <script language="javascript"> //Open Login function OPEN_login{ document.getElementById("centeredcontent").style.visibility = "visible"; } //Close Login function CLOSE_login(){ } </script> <div id="container"> <button onclick="OPEN_login();" class="design1" onmouseover="this.className = 'design2'" onmouseout="this.className = 'design1'">Login</button> <div id="centeredcontent" style="visibility: hidden;"> HERE </div> </div> </body> </html> This is the CSS: #container { height: 100%; width: 100%; margin: 0; padding: 0; } body { background-color: #E1DDD9; color: #564B47; font-family: Verdana,Arial,Helvetica,SunSans-Regular,Sans-Serif; font-size: 12px; margin: 0; padding: 0; } #centeredcontent { background-color: #F5F5F5; border: 1px dotted #000000; height: 200px; left: 50%; margin: -100px 0 0 -200px; overflow: auto; padding: 0; position: absolute; text-align: left; top: 50%; width: 400px; } .design1{background-color: #ffffff; border: 1px solid #dbdbdd; padding: 5px;} .design2{color: white; background-color: gray; border: 1px solid black; padding: 5px;} im sure this is very basic, but im very new to CSS and javascript so im getting confused.. Thanks for all help! Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/ Share on other sites More sharing options...
AyKay47 Posted September 29, 2011 Share Posted September 29, 2011 really your javascript is very simple and looks correct.. the only thing that i notice is in your script tag, the use of language instead of type.. <script type="text/javascript" language="javascript"> not sure if that will make a difference, but i believe it might.. Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/#findComment-1274042 Share on other sites More sharing options...
seany123 Posted September 29, 2011 Author Share Posted September 29, 2011 i didnt see that! however it didnt fix the problem. Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/#findComment-1274055 Share on other sites More sharing options...
nogray Posted September 29, 2011 Share Posted September 29, 2011 You would need to add an html declartion on top of your page or you'll be working in quirk mode, e.g. Instead of just html tag you'll have <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/#findComment-1274058 Share on other sites More sharing options...
seany123 Posted September 29, 2011 Author Share Posted September 29, 2011 Yes, sorry i removed that from the code i posted to try keep it as clean as possible, but the page im testing does have that exact code, however i dont think you actually NEED that code. Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/#findComment-1274059 Share on other sites More sharing options...
AyKay47 Posted September 29, 2011 Share Posted September 29, 2011 i didnt see that! however it didnt fix the problem. well at least you learned the correct way to write a script tag!.. heh okay let's look at this further.. perhaps you will want to put this function into the head of your html page instead of the body since it is a listener.. Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/#findComment-1274062 Share on other sites More sharing options...
seany123 Posted September 29, 2011 Author Share Posted September 29, 2011 i didnt see that! however it didnt fix the problem. well at least you learned the correct way to write a script tag!.. heh okay let's look at this further.. perhaps you will want to put this function into the head of your html page instead of the body since it is a listener.. yeah okay i was quite confused as to where the javascript had to go, ill place it into the HEAD. i found the problem, the OPEN_login function was missing () its working now thanks! Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/#findComment-1274063 Share on other sites More sharing options...
AyKay47 Posted September 29, 2011 Share Posted September 29, 2011 i didnt see that! however it didnt fix the problem. well at least you learned the correct way to write a script tag!.. heh okay let's look at this further.. perhaps you will want to put this function into the head of your html page instead of the body since it is a listener.. yeah okay i was quite confused as to where the javascript had to go, ill place it into the HEAD. i found the problem, the OPEN_login function was missing () its working now thanks! shoot yeah it is, my apologies for missing something simple like that...sometimes i overlook the small things Link to comment https://forums.phpfreaks.com/topic/248110-changing-css-visibility-with-javascript/#findComment-1274066 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.