By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
446,231 Members | 1,707 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 446,231 IT Pros & Developers. It's quick & easy.

display inherit and none switching in js with ie7

P: n/a
Hi all

This js i wrote to switch display on and off of a given element does
not work in ie but it does in ff and safari.

how can i make it work with ie guys?
<script type='text/javascript'>
function switch_display(switchme) {

curr_el = document.getElementById(switchme);
curr_dis = curr_el.style.display;

if (curr_dis != 'none') {
hidethis(curr_el);
}
if (curr_dis == 'none') {
showthis(curr_el);
}

return;

}

function hidethis(curr_el) {
curr_el.style.display = 'none';
}

function showthis(curr_el) {
curr_el.style.display = 'inherit';
}
</script>

<input type="button" onClick="switch_display('testdiv');" value="button
to switch display">

<div id="testdiv">some text
</div>

Jan 3 '07 #1
Share this Question
Share on Google+
7 Replies


P: n/a
>
This js i wrote to switch display on and off of a given element does
not work in ie but it does in ff and safari.

i should probably be more explicit, by 'does not work in ie' i mean it
will hide hidden text but will not display it again when u re-click the
button

Jan 3 '07 #2

P: n/a
libsfan01 said the following on 1/3/2007 11:22 AM:
>This js i wrote to switch display on and off of a given element does
not work in ie but it does in ff and safari.


i should probably be more explicit, by 'does not work in ie' i mean it
will hide hidden text but will not display it again when u re-click the
button
display:visible
display:hidden

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Jan 3 '07 #3

P: n/a
Randy Webb wrote:
libsfan01 said the following on 1/3/2007 11:22 AM:
>>This js i wrote to switch display on and off of a given
element does not work in ie but it does in ff and safari.

i should probably be more explicit, by 'does not work in ie'
i mean it will hide hidden text but will not display it
again when u re-click the button

display:visible
display:hidden
The permissible values of the CSS display property (as defined in the
CSS 2.0 spec) are:- inline | block | list-item | run-in | compact |
marker | table | inline-table | table-row-group | table-header-group |
table-footer-group | table-row | table-column-group | table-column |
table-cell | table-caption | none | inherit

I am not sure why 'inherit' appears in that list as the property index
(appendix F) states that the property is not inherited.

Richard.
Jan 4 '07 #4

P: n/a
"Richard Cornford" <Ri*****@litotes.demon.co.ukwrote:
>The permissible values of the CSS display property (as defined in the
CSS 2.0 spec) are:- inline | block | list-item | run-in | compact |
marker | table | inline-table | table-row-group | table-header-group |
table-footer-group | table-row | table-column-group | table-column |
table-cell | table-caption | none | inherit
Despite the fact that officially the 2.0 spec is the only CSS2.x spec
with Rec status, for practical web authoring CSS2.0 should be considered
obsolete and of historical relevance only. Authors should consult the
CSS2.1 Draft instead.
>I am not sure why 'inherit' appears in that list as the property index
(appendix F) states that the property is not inherited.
Not by default, but it can be if explicitly specified.
http://www.w3.org/TR/CSS21/cascade.h...ue-def-inherit

--
Spartanicus
Jan 4 '07 #5

P: n/a

libsfan01 wrote:
Hi all

This js i wrote to switch display on and off of a given element does
not work in ie but it does in ff and safari.

how can i make it work with ie guys?
<script type='text/javascript'>
function switch_display(switchme) {

curr_el = document.getElementById(switchme);
curr_dis = curr_el.style.display;

if (curr_dis != 'none') {
hidethis(curr_el);
}
if (curr_dis == 'none') {
showthis(curr_el);
}

return;

}
Display toggle functions are usually written something like:

function switch_display(switchme) {
var el = document.getElementById(switchme);
el.style.display = (el.style.display == 'none')? '' : 'none';
}

Don't forget feature detection.
--
Rob

Jan 4 '07 #6

P: n/a
Display toggle functions are usually written something like:
>
function switch_display(switchme) {
var el = document.getElementById(switchme);
el.style.display = (el.style.display == 'none')? '' : 'none';
}
Thanks Rob that works great. can anyone explain to me how this line of
code works:

el.style.display = (el.style.display == 'none')? '' : 'none';

what do the ? and : characters do, does it work something like, if
display equals 'none' then display becomes '' and if display = '' then
display becomes 'none'

are there any good online resources on this type of control structure?

thanks again :-)

marc

Jan 5 '07 #7

P: n/a
libsfan01 wrote:
>Display toggle functions are usually written something like:

function switch_display(switchme) {
var el = document.getElementById(switchme);
el.style.display = (el.style.display == 'none')? '' : 'none';
}

Thanks Rob that works great. can anyone explain to me how this line of
code works:

el.style.display = (el.style.display == 'none')? '' : 'none';

what do the ? and : characters do, does it work something like, if
display equals 'none' then display becomes '' and if display = '' then
display becomes 'none'
Yes, its the conditional operator:

<URL:
http://developer.mozilla.org/en/docs...ional_operator
>
and is a shortcut way of writing:

if (el.style.display == 'none') {
el.style.display = '';
} else {
el.style.display = 'none';
}

are there any good online resources on this type of control structure?
The FAQ lists a good selection of javascript resources (including the
Core JavaScript 1.5 Guide referenced above):

<URL: http://www.jibbering.com/faq/#FAQ3_2 >
--
Rob
Jan 5 '07 #8

This discussion thread is closed

Replies have been disabled for this discussion.