954,598 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Have something to say? Contribute New Article Reply to this Article

How to display panel with close button on top ??

hi,


please help me to do this.

i want to display one panel on top space.
and

i want one button on that panel to close itself.

please help me.

thanks in advance

Jack

jackparsana
Junior Poster in Training
54 posts since Sep 2010
Reputation Points: 10
Solved Threads: 1
 

What did you try? You'll need to write a small javascript thing that hides or removes the element.

twiss
Veteran Poster
1,005 posts since Apr 2010
Reputation Points: 177
Solved Threads: 101
 
<button id="frorm" onClick="showIt('layer1');">OPEN</button>
<script type="text/javascript">
<!--
(document.getElementById) ? dom = true : dom = false;
function hideIt(ID) {
if (dom) {document.getElementById(ID).style.visibility='hidden';}
if (document.layers) {document.layers[ID].visibility='hide';} }
function showIt(ID) {
if (dom) {document.getElementById(ID).style.visibility='visible';}
if (document.layers) {document.layers[ID].visibility='show';} }
--></script>
<div id="layer1" style="position:fixed; left:10px; z-index:10; width:50%; visibility:hidden; padding:10px; margin:10px; background:#ececec; border: 1px solid;">
<button id="form1" onclick="hideIt('layer1');">Close</button>
lorem ipsum bla bla bla bla bla bla bla bla lorem ipsum bla bla bla bla bla bla bla bla bla bla bla lorem ipsum bla bla bla bla bla bla bla bla lorem ipsum bla bla bla bla bla bla bla bla lorem ipsum bla bla bla bla bla bla bla bla lorem ipsum bla bla bla bla bla bla bla bla
<button id="form" onclick="hideIt('layer1');">Close</button></div>

multiple divs can be hidden.shown by their id
styling belongs in the stylesheet, this sample is not optimal

almostbob
Posting Sensei
3,149 posts since Jan 2009
Reputation Points: 571
Solved Threads: 376
 

I don't think you need to check for getElementByID support. I believe IE4 supported it, already.

twiss
Veteran Poster
1,005 posts since Apr 2010
Reputation Points: 177
Solved Threads: 101
 

the DOM you dont recognize is for early netscape & mozilla based browsers,

good practice to support everything, especially when its only a single line of conditional code
belt and braces, versions of mozilla based browsers(firefox) for linux BEOS etc do not support getelementbyid
in a few computer centuries (months), such support will be unncessary, but till everybody uses the same windows12 and ie33, , ,
its good practice to ensure compatibility with other OS/browser combinations
link <-- humor I enjoy the animation

almostbob
Posting Sensei
3,149 posts since Jan 2009
Reputation Points: 571
Solved Threads: 376
 

thanks for reply...

thank you for answer..

jackparsana
Junior Poster in Training
54 posts since Sep 2010
Reputation Points: 10
Solved Threads: 1
 

This question has already been solved

Post: Markdown Syntax: Formatting Help
You
View similar articles that have also been tagged: