Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Help about div hide/show

Reply
Thread Tools

Help about div hide/show

 
 
ali
Guest
Posts: n/a
 
      01-12-2007
Hello every one

i need you help regarding div hide and show. i am having a link like
<a href="#" onClick="expandWin()">show/hide </a>
<div id=showHide>

</div>


within div i have lots of form tags and div elements say n. The problem
here is i try to hide showHide by calling function
function hideWin()
{

document.getElementById("showHide").style.visibili ty="hidden";
}
but divs within above div don't get hide.

one way is to loop through all divs and made their visibility="hidden"
but it can't work for me as i have to hide a particular portion of web
page and no of divs within that protion is unknown. and making all divs
hidden by getElementByID(DivId) is impractial and overhead

any solution..

 
Reply With Quote
 
 
 
 
ASM
Guest
Posts: n/a
 
      01-12-2007
ali a écrit :
> Hello every one
>
> i need you help regarding div hide and show. i am having a link like
> <a href="#" onClick="expandWin()">show/hide </a>
> <div id=showHide>
>
> </div>
>
>
> within div i have lots of form tags and div elements say n. The problem
> here is i try to hide showHide by calling function
> function hideWin()
> {
>
> document.getElementById("showHide").style.visibili ty="hidden";
> }
> but divs within above div don't get hide.


What do you mean by "above" divs ?
previous divs ?
or
divs displayed over the showHide div ?
or
divs contained by showHide ?

> one way is to loop through all divs and made their visibility="hidden"
> but it can't work for me as i have to hide a particular portion of web
> page and no of divs within that protion is unknown. and making all divs
> hidden by getElementByID(DivId) is impractial and overhead
>
> any solution..


Your page as described seems curiously built ...
(all elements in absolute, no ?)


--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
 
Reply With Quote
 
 
 
 
ali
Guest
Posts: n/a
 
      01-14-2007
i need you help regarding div hide and show. i am having a link like
<a href="#" onClick="expandWin()">show/hide </a>
<div id=showHide>

</div>


within div i have lots of form tags and div elements say n. The problem
here is i try to hide showHide by calling function
function hideWin()
{


document.getElementById("hideable").style.visibili ty="hidden";
}

>
> What do you mean by "above" divs ?
> previous divs ?
> or
> divs displayed over the showHide div ?
> or
> divs contained by showHide ?

By divs i mean divs contined by show hide
<div id="showHide">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3">
<div id="div3.1">
<input type="text" name="hideable" value="want
to hide this text on click event">
</div>
</div>

</div>

>
> Your page as described seems curiously built ...
> (all elements in absolute, no ?)
>
>
> --
> Stephane Moriaux et son (moins) vieux Mac déjà dépassé
> Stephane Moriaux and his (less) old Mac already out of date


how can i access "id=hideable" text box to hide it

 
Reply With Quote
 
Evertjan.
Guest
Posts: n/a
 
      01-14-2007
ali wrote on 14 jan 2007 in comp.lang.javascript:

> i need you help regarding div hide and show. i am having a link like
> <a href="#" onClick="expandWin()">show/hide </a>
> <div id=showHide>
>
> </div>
>
>
> within div i have lots of form tags and div elements say n. The problem
> here is i try to hide showHide by calling function
> function hideWin()
> {
>
>
> document.getElementById("hideable").style.visibili ty="hidden";
> }
>
>>
>> What do you mean by "above" divs ?
>> previous divs ?
>> or
>> divs displayed over the showHide div ?
>> or
>> divs contained by showHide ?

> By divs i mean divs contined by show hide
> <div id="showHide">
> <div id="div1"></div>
> <div id="div2"></div>
> <div id="div3">
> <div id="div3.1">
> <input type="text" name="hideable"


add this:

id="hideable"

> value="want
> to hide this text on click event">
> </div>
> </div>
>
> </div>
>
>>
>> Your page as described seems curiously built ...
>> (all elements in absolute, no ?)

>
> how can i access "id=hideable" text box to hide it


and do:

document.getElementById("hideable").style.visibili ty="hidden";

or do:

document.getElementById("hideable").style.visibili ty="div3.1";

Remember, on a page the id's need to be named uniquely!

However, perhaps you want something like this:

================================================
<script type='text/javascript'>

function toggle(id,n) {
var el = document.getElementById(id).childNodes
for (i=0;i<el.length;i++)
if (el[i].firstChild.className == 'hideable' + n)
el[i].firstChild.style.visibility =
(el[i].firstChild.style.visibility=='')?'hidden':'';
}

</script>

<div id='showHide'>
<div>something else</div>
<div>
<input type='text' name='hideable' class='hideable1'
value='input 1 want to show/hide this on click event'>
</div>
<div>
<input type='text' name='hideable' class='hideable2'
value='input 2 want to show/hide this on click event'>
</div>
<div>
<input type='text' name='hideable' class='hideable3'
value='input 3 want to show/hide this on click event'>
</div>
</div>

<a href='#' onClick='toggle("showHide",1)'>show/hide 1</a><br>
<a href='#' onClick='toggle("showHide",2)'>show/hide 2</a><br>
<a href='#' onClick='toggle("showHide",3)'>show/hide 3</a><br>
================================================

only ie7 tested!

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
 
Reply With Quote
 
ASM
Guest
Posts: n/a
 
      01-14-2007
ali a écrit :
> i need you help regarding div hide and show. i am having a link like
> <a href="#" onClick="expandWin()">show/hide </a>


> here is i try to hide showHide by calling function
> function hideWin()
> {
> document.getElementById("hideable").style.visibili ty="hidden";
> }
>
> <div id="showHide">
> <div id="div1"></div>
> <div id="div2"></div>
> <div id="div3">
> <div id="div3.1">
> <input type="text" name="hideable"
> value="want to hide this text on click event">
> </div>
> </div>
> </div>


In fact you want to hide the div 'div3.1' no ?

If yes :
function hideWin() {
var d = document.getElementById("div3.1").style;
d.visibility = d.visibility==""? "hidden" : "";
}

Or to switch between show and hide :

function ShowHide(idDiv) {
var d = document.getElementById(idDiv).style;
d.visibility = d.visibility==""? "hidden" : "";
return false;
}

<a href="#" onclick="ShowHide('div3.1');">
show/hide div 'div3.1'
</a>


Now, if you want to hide an element of your form, it is better to call
this element by forms tree :

function hidder(form_name, element_name) {
document.forms[form_name].elements[element_name].style.visibility='hidden';
}

<a href="#" onclick="hidder('myForm','hideable');">
hide textfield "hideable"
</a>


--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
 
Reply With Quote
 
ASM
Guest
Posts: n/a
 
      01-14-2007
ASM a écrit :
>
> In fact you want to hide the div 'div3.1' no ?
>
> If yes :


function Hide(idDiv) {
document.getElementById(idDiv).style.visibility = "hidden";
return false;
}

<a href="#" onclick="Hide('div3.1');">
hide div 'div3.1' and its textfield
</a>

--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
<div ... /> and <div ...></div> K Viltersten ASP .Net 4 03-31-2009 07:33 PM
<div id="help" runat="server"></div> Jim in Arizona ASP .Net 3 11-17-2005 04:15 PM
NS/FF don't change div offsetWidth when div innerHTML is added toand div becomes wider mscir Javascript 3 06-26-2005 04:04 PM
help changing DIV content - want to put a javascript into the DIV rpesq@my-deja.com Javascript 2 06-17-2005 12:02 PM
Q: Div A inside Div B is larger than Div B Dwayne Madsen Javascript 1 06-01-2005 03:02 PM



Advertisments