[thelist] Need some JS help - unobtrusive popup - based on CLASS not id.
ben morrison
morrison.ben at gmail.com
Fri Jun 15 11:28:13 CDT 2007
On 6/15/07, Jon Hughes <hughesj at firemtn.com> wrote:
> Here's what I have so far:
>
> function detpopup() {
> if (!document.getElementsByTagName || !document.getElementById) return
> false;
> if (!document.getElementById('content').className == 'detpopupcont')
> return false;
> var detpopup = document.getElementById('content').className =
> 'detpopupcont';
> detpopup.style.visibility='visible';
> }
>
>
> The HTML is like so:
>
> <div id="content">
> <div class="detpopupcont" style="visibility:hidden">This is hidden with
> no javascript</div>
> <div class="detpopupcont" style="visibility:hidden">This is hidden with
> no javascript</div>
> <div class="detpopupcont" style="visibility:hidden">This is hidden with
> no javascript</div>
> </div>
>
> When the page loads, I want all of those to become "visibility:visible"
> but this is my first bit of JS, and I need help :-/
>
Hmm seems to be an access key to send a email using gmail!!
There are a lot of functions that have been written for the lack of
getElementsByClass, here's one:
http://www.dustindiaz.com/getelementsbyclass/
var popUps= getElementsByClass('detpopupcont');
this will return an array, so now you can loop through that array
for(i=0;i<popUps.length;i++) {
popUps[i].style.visibility='visible'
}
It might be better to use different classes instead, .detpopupcont {
visibility:hidden;}, .detpopupShow {visibility:visible;}
that way you have more control and it separates the logic more.
for(i=0;i<popUps.length;i++) {
popUps[i].className='detpopupShow ';
}
ben
PS a good way to attach onload events:
simon willison's addloadevent
http://simon.incutio.com/archive/2004/05/26/addLoadEvent
--
Ben Morrison
http://www.benjaminmorrison.com
More information about the thelist
mailing list