468,241 Members | 1,574 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,241 developers. It's quick & easy.

Make html button disappear with javascript?


Hi,

Is it possible to make a html button invisible using javascript?
I can certainly disable it:

var x=document.getElementById('button2');
x.disabled=true;
//x.type = 'hidden'; // read only?
//x.visible = false; // doesn't exist?

but is there a property i can (ab)use to make it invisible?

Thanks in advance.

Aug 5 '05 #1
3 31417
FantaJ wrote:
Hi,

Is it possible to make a html button invisible using javascript?
I can certainly disable it:

var x=document.getElementById('button2');
x.disabled=true;
//x.type = 'hidden'; // read only?
input type hidden is not the same as readonly - the user can't see it
so in that sense a readonly input it's not readable at all.
//x.visible = false; // doesn't exist?

but is there a property i can (ab)use to make it invisible?
You can hide elements using:

x.style.display = 'none';
or
x.style.visibility = 'hidden';

and to make it visible again:

x.style.display = '';
or
x.style.visibility = 'visible';

The difference is that display 'none' will make the element take up
zero space in the page and hence will likely affect page layout.
Visibility just hides/shows the element with no effect on page layout.

Thanks in advance.


--
Rob
Aug 5 '05 #2
Thanks Rob - just what i was looking for.

Aug 5 '05 #3
"FantaJ" <vi*********@gmail.com> wrote in message
news:11**********************@g43g2000cwa.googlegr oups.com...

Hi,

Is it possible to make a html button invisible using javascript?
I can certainly disable it:

var x=document.getElementById('button2');
x.disabled=true;
//x.type = 'hidden'; // read only?
//x.visible = false; // doesn't exist?

but is there a property i can (ab)use to make it invisible?

Thanks in advance.


<button id="myButton">My Button</button>
<button onclick="toggleVisibility('myButton');">Hide/show My
Button</button>
<button onclick="toggleDisplay('myButton');">Remove/restore My
Button</button>
<script type="text/javascript">
function toggleDisplay(id) {
var el;
if (document.getElementById) {
el = document.getElementById(id);
} else if (document.all) {
el = document.all[id];
}

if (el && (el = el.style) && ('string' == typeof el.display)) {
el.display = ('none' == el.display ? '' : 'none');
}
}
function toggleVisibility(id) {
var el;
if (document.getElementById) {
el = document.getElementById(id);
} else if (document.all) {
el = document.all[id];
}

if (el && (el = el.style) && ('string' == typeof el.visibility)) {
el.visibility = ('hidden' == el.visibility ? 'visible' :
'hidden');
}
}
</script>
--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq
Aug 5 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

7 posts views Thread by Howard Jess | last post: by
5 posts views Thread by Susan Bricker | last post: by
reply views Thread by kermitthefrogpy | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.