Hi Michael,

No, :hover isn't an option since what I want to do is have stuff hidden when
you print it. I'm using Zeldman's "toggle" script, and I want to set it up
so that only expanded items will print (at the moment the headings of
non-expanded items also prints, so that you get a lot of wasted paper). It's
in a reports section, so logically a person printing the page is only
interested in the section they've expanded.

So we have something like:

<ul>
  <li class="noPrint"><a href="#" onclick="toggle(1)"
onKeyPress="toggle(1)">CategoryName1</a></li>
  <li class="noPrint">
    <ul id="1" style="display: none;">
      <li class="noPrint"><a href="#" onclick="toggle(2)"
onKeyPress="toggle(2)">SubcategoryName1</a></li>
      <li class="noPrint">
        <ul id="2" style="display: none;">
          <li class="noPrint"><a href="#" onclick="toggle(3)"
onKeyPress="toggle(3)">SectionName1</a></li>
          <li>
            <div id="3" style="display: none;">
              <p>ItemName1</p>
            </div>
          </li>
        </ul>
      </li>
    </ul>
  </li>
  <li class="noPrint"><a href="#" onclick="toggle(4)"
onKeyPress="toggle(4)">CategoryName2</a></li>
  <li class="noPrint">
    <ul id="4" style="display: none;">
      <li class="noPrint"><a href="#" onclick="toggle(5)"
onKeyPress="toggle(5)">SubcategoryName2</a></li>
      <li class="noPrint">
        <ul id="5" style="display: none;">
          <li class="noPrint"><a href="#" onclick="toggle(6)"
onKeyPress="toggle(6)">SectionName2</a></li>
          <li>
            <div id="6" style="display: none;">
              <p>ItemName2</p>
            </div>
          </li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

This is a cutdown version of the code for the page, taking out all of the
other details that show along with the ItemName, as well as the code for the
looping (I've pasted in two sets instead, just to give the idea), but it
shows the essential format. What I want is that if only the top set is
expanded, CategoryName2 will not actually print at all. So when a link is
clicked, as well as toggling the referred ID to visible, it will set the
class of the parent element from "noPrint" to "Print".

Is that something that can be done? How do you isolate the parent element to
do something to it?



Seona.

> -----Original Message-----
> From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
> Behalf Of Michael Nelson
> Sent: Saturday, 4 September 2004 8:45 AM
> To: [EMAIL PROTECTED]
> Subject: Re: [WSG] Anyone know of any good DOM tutorials?
> 
> 
> Seona,
> 
> Is there good reason not to use CSS psuedo classes such as :hover etc?
> (http://www.htmldog.com/guides/cssintermediate/pseudoclasses/)
> 
> I guess you're doing something more complex than the example below...
> 
> On Sat, 2004-09-04 at 08:28, Michael Nelson wrote:
> > Hmm... not sure about a tutorial, but adapting Patrick Griffaths DOM
> > example for avoiding email spam at
> > http://www.htmldog.com/ptg/archives/000063.php
> > 
> > would give something like:
> > 
> > function changeClass(id, newclass){
> > 
> >   elementToChange = document.getElementById(id);
> >   elementToChange.setAttribute("class", newclass);
> >   
> > }
> > 
> > Then you'd need to associate this function with the element/event that
> > you want to use... such as:
> > 
> > document.getElementById("myMenuItem").onmouseover = function(){
> > changeClass("myMenuItem", "thenewclassname")}
> > 
> > Actually, with the last bit I'm not too sure whether I'm mixing my old
> > JS habits with proper DOM coding... perhaps someone more knowledgable
> > can check it when they read this!
> > 
> > Hope it helps!
> > -Michael.
> > 
> > On Sat, 2004-09-04 at 07:42, Seona Bellamy wrote:
> > > Hi guys,
> > > 
> > > Anyone know where I can find a good, easy to follow online 
> tutorial on using
> > > the DOM to control elements on a webpage? Specifically, I 
> need to change the
> > > class of an element to a different class.
> > > 
> > > Cheers,
> > > 
> > > Seona.
> > > 
> > > __________________________________________________________________
> > > << ella for Spam Control >> has removed Spam messages and set 
> aside Later
> > > for me
> > > You can use it too - and it's FREE!  http://www.ellaforspam.com
> > > 
> > > ---
> > > Outgoing mail is certified Virus Free.
> > > Checked by AVG anti-virus system (http://www.grisoft.com).
> > > Version: 6.0.749 / Virus Database: 501 - Release Date: 1/09/2004
> > > 
> > > 
> > > ******************************************************
> > > The discussion list for  http://webstandardsgroup.org/
> > > 
> > > Proud presenters of Web Essentials 04 http://we04.com/
> > >  Web standards, accessibility, inspiration, knowledge
> > > To be held in Sydney, September 30 and October 1, 2004
> > > 
> > >  See http://webstandardsgroup.org/mail/guidelines.cfm
> > >  for some hints on posting to the list & getting help
> > > ******************************************************
> > > 
> 
> ******************************************************
> The discussion list for  http://webstandardsgroup.org/
> 
> Proud presenters of Web Essentials 04 http://we04.com/
>  Web standards, accessibility, inspiration, knowledge
> To be held in Sydney, September 30 and October 1, 2004
> 
>  See http://webstandardsgroup.org/mail/guidelines.cfm
>  for some hints on posting to the list & getting help
> ******************************************************
> 
> 
> ---
> Incoming mail is certified Virus Free.
> Checked by AVG anti-virus system (http://www.grisoft.com).
> Version: 6.0.749 / Virus Database: 501 - Release Date: 1/09/2004
> 

__________________________________________________________________
<< ella for Spam Control >> has removed Spam messages and set aside Later
for me
You can use it too - and it's FREE!  http://www.ellaforspam.com

---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.749 / Virus Database: 501 - Release Date: 1/09/2004
 

<<attachment: winmail.dat>>

Reply via email to