Re: [WSG] Anyone know of any good DOM tutorials?
Hi, and good morning (again :) ! Project seven http://www.projectseven.com/tutorials/navigation/swapclassmenu/index.htm has something that may be helpfull to you. Not straight away but with a little tweaking ... :) Also usefull in your case (i think): http://www.alistapart.com/articles/printyourway/ http://www.alistapart.com/articles/printyourway/ and http://www.alistapart.com/articles/goingtoprint/(this article is a classic ;) Hope it helpes, Mugur Padurean 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 **
RE: [WSG] Anyone know of any good DOM tutorials?
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=noPrinta href=# onclick=toggle(1)
onKeyPress=toggle(1)CategoryName1/a/li
li class=noPrint
ul id=1 style=display: none;
li class=noPrinta href=# onclick=toggle(2)
onKeyPress=toggle(2)SubcategoryName1/a/li
li class=noPrint
ul id=2 style=display: none;
li class=noPrinta href=# onclick=toggle(3)
onKeyPress=toggle(3)SectionName1/a/li
li
div id=3 style=display: none;
pItemName1/p
/div
/li
/ul
/li
/ul
/li
li class=noPrinta href=# onclick=toggle(4)
onKeyPress=toggle(4)CategoryName2/a/li
li class=noPrint
ul id=4 style=display: none;
li class=noPrinta href=# onclick=toggle(5)
onKeyPress=toggle(5)SubcategoryName2/a/li
li class=noPrint
ul id=5 style=display: none;
li class=noPrinta href=# onclick=toggle(6)
onKeyPress=toggle(6)SectionName2/a/li
li
div id=6 style=display: none;
pItemName2/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/63.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
RE: [WSG] Anyone know of any good DOM tutorials?
Why not simply set up your Print CSS file to print only the main content? If the person is only after that information everything else is a waste of paper. Everyone always tries to find fancy ways to do simply tasks. Shame. Lee Roberts HYPERLINK http://www.roserockdesign.com http://www.roserockdesign.com HYPERLINK http://www.applepiecart.com http://www.applepiecart.com _ From: Seona Bellamy [HYPERLINK mailto:[EMAIL PROTECTED] mailto:[EMAIL PROTECTED] Sent: Sunday, September 05, 2004 5:55 PM To: [EMAIL PROTECTED] Subject: RE: [WSG] Anyone know of any good DOM tutorials? 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=noPrinta href=# onclick=toggle(1) onKeyPress=toggle(1)CategoryName1/a/li li class=noPrint ul id=1 style=display: none; li class=noPrinta href=# onclick=toggle(2) onKeyPress=toggle(2)SubcategoryName1/a/li li class=noPrint ul id=2 style=display: none; li class=noPrinta href=# onclick=toggle(3) onKeyPress=toggle(3)SectionName1/a/li li div id=3 style=display: none; pItemName1/p /div /li /ul /li /ul /li li class=noPrinta href=# onclick=toggle(4) onKeyPress=toggle(4)CategoryName2/a/li li class=noPrint ul id=4 style=display: none; li class=noPrinta href=# onclick=toggle(5) onKeyPress=toggle(5)SubcategoryName2/a/li li class=noPrint ul id=5 style=display: none; li class=noPrinta href=# onclick=toggle(6) onKeyPress=toggle(6)SectionName2/a/li li div id=6 style=display: none; pItemName2/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. -- Outgoing mail is certified Virus Free. Checked by AVG Anti-Virus (http://www.grisoft.com). Version: 7.0.262 / Virus Database: 264.7.7 - Release Date: 9/3/2004 attachment: winmail.dat
Re: [WSG] Anyone know of any good DOM tutorials?
Hmm... not sure about a tutorial, but adapting Patrick Griffaths DOM
example for avoiding email spam at
http://www.htmldog.com/ptg/archives/63.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
**
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/63.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
**
Re: [WSG] Anyone know of any good DOM tutorials?
Hi Seona, Mozilla has really good DOM resources http://www.mozilla.org/docs/dom/ http://www.mozilla.org/docs/dom/domref/ This might be specifically what you want http://www.mozilla.org/docs/dom/domref/dom_el_ref4.html#1027595 Tony Aslett http://www.csscreator.com/ 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. ** 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 **
