[Javascript] Show and hide multiple div tags
Abyss - Information
Info at Abyss.ws
Tue May 9 22:57:55 CDT 2006
Thank you for your help....i have some code that works after about 3 or 4
clicks not the first click though...
still trying to figure that one out...thanks again
----- Original Message -----
From: "Cutter (JS Related)" <java.script at cutterscrossing.com>
To: "[JavaScript List]" <javascript at LaTech.edu>
Sent: Tuesday, May 09, 2006 9:09 PM
Subject: Re: [Javascript] Show and hide multiple div tags
> Or, say you are populating your page via some server-side language
> (ColdFusion is my choice) and outputting x number of articles to the page.
> You would have some sort of record count for the number of articles you
> are outputting, and you can pass this to your js function, along with the
> article you wish to 'show'. (None of this is tested, so it might require
> some tweaking.) Something along these lines:
>
> /* If you consistently name your articles 'article1,article2,etc.'
> then it becomes very easy to 'show' one element, while hiding
> any others whic may be displayed. For this function, just pass
> in the number of the article to display (artNum) and the total
> count (artCount) of how many articles you have on display */
> function showHide(artNum,artCount){
> for(i=1;i<=artCount;i++{
> artID = 'article' + i;
> article = document.getElementById(artID);
> if(i != artNum){
> if(article.style.display == 'block')
> article.style.display = 'none';
> else
> article.style.display = 'block';
> }
> }
> }
>
> -----
> Then you would have your articles:
>
> <a href="javascript:void(0);" onclick="showHide(1,2)">Article 1</a>
> <div id="article1">blah, blah, blah</div>
> <a href="javascript:void(0);" onclick="showHide(2,2)">Article 2</a>
> <div id="article2">blah, blah, blah again</div>
>
> -----
> Something like that, anyway. Hope it helps.
>
> Cutter
> _______
> http://blog.cutterscrossing.com
>
>
> Andrew Gibson wrote:
>> something like this:
>>
>> where exID is the id of your "ExtendedDescription"
>>
>> function showHide(exID)
>> {
>> var show=document.getElementById(exID)
>>
>> if(show.style.display=="none")
>> show.style.display="";
>> else
>> show.style.display="none"
>>
>> }
>>
>>
>>
>> ==========================================
>> Perhaps - would it be best to put in an ID for each news item?
>>
>> eg
>>
>>
>> <div class="News">
>> <div id="NewsItem">
>> <h2>News title 1</h2>
>> <div class="BriefDescription"></div>
>> <div class="ShowExtendedDescription"><a href="#"
>> onclick="jsfncShowHideExtendedDescription('NI1234')">Show Extended
>> Description for this event</a></div>
>> <div id="NI1234" class="ExtendedDescription"></div>
>> </div>
>>
>> if so how would I pass the news item to the function? like i have in this
>> example? as a string?
>>
>> and how would i tell the browser to change the class for that particular
>> div?
>>
>> Thanks
>>
>> Regards
>> Abyss
>>
>>
>>
>> _______________________________________________
>> Javascript mailing list
>> Javascript at LaTech.edu
>> https://lists.LaTech.edu/mailman/listinfo/javascript
>> _______________________________________________
>> Javascript mailing list
>> Javascript at LaTech.edu
>> https://lists.LaTech.edu/mailman/listinfo/javascript
>
> --
>
> Cutter
> ____________
> http://blog.cutterscrossing.com
>
> "The Past is a Memory
> The Future a Dream
> But Today is a Gift
> That's why they call it
> The Present"
> _______________________________________________
> Javascript mailing list
> Javascript at LaTech.edu
> https://lists.LaTech.edu/mailman/listinfo/javascript
>
More information about the Javascript
mailing list