drayarms Posted July 31, 2011 Share Posted July 31, 2011 Hello people, well this is not an Ajax question. It's a Javascript/DOM question but I figured I could post it on here since Ajax programmers must be Javacript gurus to begin with, or at least so I think, and since there is no forum on this site specifically for Javascript. I have looked at this code in and out and can't seem to find out what the problem is. I have a link on a webpage with id name comment_stream on which when users click, is supposed to display an otherwise hidden comment box (id name comment_stream_div) and at the same time, hide the comment link, you know the type on facebook and other social networking sites. I am using javascript functions to accomplish this with an onclick event. The idea is to toggle between the display attributes (block and none) of the elements i wish to hide or display with the onclick event. Well, my code seems to work, except that as the topic clearly states, the expected results simply flash for a brief second or two and then dissapear. They don't hang around as expected. I will show the javasscript below, as well as the the html for the elements involved and the css. <script type='text/javascript'> function show_comment_stream_div() { document.getElementById('comment_stream_div').style.display = 'block'; document.getElementById('comment_stream').style.display = 'none'; document.getElementById('comment_stream_div').syle.position = 'relative' ; document.getElementById('comment_stream_div').syle.bottom = '82px' ; document.getElementById('comment_stream_div').syle.left = '123px' ; } </script> //Print the comment link <p id = 'comment_stream' onclick = 'show_comment_stream_div()' > <a href = ''> Comments: </a> </p>"; //Print out the comments div. <div id = 'comment_stream_div' onmouseover = 'show_close_comment_stream_div()' onmouseout = ' hide_close_comment_stream_div()'> <p id = 'close_comment_stream_div' onclick = 'hide_comment_stream_div()'> <a> X </a> </p> <form action = 'status_comment_entry.php'> <input id = 'comment_stream_input' type = 'textarea' rows = '8' cols = '20' value ='' name = 'comment' /> <br/> <input id = 'comment_stream_submit' type = 'submit' value = 'submit!' name = 'submit' /> </form> </div> #comment_stream {position:relative;bottom:70px;left:230px; color:#2d73b9; display:block;} #comment_stream_div { border-style:solid; border-width:1px; border-color:#c0c0c0; display:none;} Well folks, can anyone tell me what I'm doing wrong? Here are screenshots of the elements in question: Link to comment https://forums.phpfreaks.com/topic/243412-onclick-doesnt-yield-expected-results-results-simply-flash-and-vanish/ Share on other sites More sharing options...
drayarms Posted July 31, 2011 Author Share Posted July 31, 2011 And one other problem I didn't mention, the positioning doesn't work after the onclick event. The div stays in its defualt position. Link to comment https://forums.phpfreaks.com/topic/243412-onclick-doesnt-yield-expected-results-results-simply-flash-and-vanish/#findComment-1249958 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.