RE: [WSG] Can someone help me figure out some semantic mark-up, please?
El dom, 29-08-2004 a las 00:49, Seona Bellamy escribió:
Thanks for the help, guys. I've gone with the dl as suggested by
Mordechai, and the script that was in Zeldman's book (sorry, Mordechai, but
it seemed like a slightly simpler, more flexible way of doing it - or maybe
it's just that I've combed through it so often that I actually understand
what it does!).
The script, for those who don't have the book, is as follows:
function toggle(targetID) {
if (document.getElementById) {
target = document.getElementById(targetID);
if (target.style.display == none) {
target.style.display = ;
Shouldn't that be
target.style.display = block;
?
--
Manuel trabaja para Simplelógica, construcción web
(+34) 985 22 12 65http://simplelogica.net
escribe en Logicola http://simplelogica.net/logicola/
**
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] Can someone help me figure out some semantic mark-up, please?
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
Behalf Of Manuel González Noriega
The script, for those who don't have the book, is as follows:
function toggle(targetID) {
if (document.getElementById) {
target = document.getElementById(targetID);
if (target.style.display == none) {
target.style.display = ;
Shouldn't that be
target.style.display = block;
Err... which one? The first one or the second one?
Confuzzled,
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.740 / Virus Database: 494 - Release Date: 16/08/2004
attachment: winmail.dat
RE: [WSG] Can someone help me figure out some semantic mark-up, please?
El lun, 30-08-2004 a las 09:49, Seona Bellamy escribió: Shouldn't that be target.style.display = block; Err... which one? The first one or the second one? Confuzzled, My fault entirely, i trimmed a little too happily :) The second one, as if the display is set to none you most likely want to toggle it to block -- Manuel trabaja para Simplelógica, construcción web (+34) 985 22 12 65http://simplelogica.net escribe en Logicola http://simplelogica.net/logicola/ ** 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] Can someone help me figure out some semantic mark-up, please?
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Behalf Of Manuel González Noriega Shouldn't that be target.style.display = block; Err... which one? The first one or the second one? Confuzzled, My fault entirely, i trimmed a little too happily :) The second one, as if the display is set to none you most likely want to toggle it to block Hmm OK, I'll try that. As I said before, I got the code from a book, so I don't fully understand why it does what it does. :) 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.740 / Virus Database: 494 - Release Date: 16/08/2004 attachment: winmail.dat
RE: [WSG] Can someone help me figure out some semantic mark-up, please?
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] Behalf Of Nick Gleitzman Seona, depending on the doctype you're using, ID's that are just numbers won't validate. They need to start with an alpha character - for XHTML 1 Strict, at least. But there again, if your project is for offline use, maybe validation doesn't matter... ;o) Interesting... so technically using numbers is invalid, but when I use anything but numbers, my code stops working. Great. *wry smile* Something of a damned if I do, damned if I don't situation. Then again, this part is just on the back-end, so as long as it works on their internal browsers it's not the end of the world if it doesn't validate perfectly. At least the public front-end is pretty much valid code. So I think I'll put this one to bed now, and on a different project with a different budget (and more time) I'll get back to investigating making the code work with text ID's. :) Thanks, 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.740 / Virus Database: 494 - Release Date: 16/08/2004 attachment: winmail.dat
RE: [WSG] Can someone help me figure out some semantic mark-up, please?
Thanks for the help, guys. I've gone with the dl as suggested by
Mordechai, and the script that was in Zeldman's book (sorry, Mordechai, but
it seemed like a slightly simpler, more flexible way of doing it - or maybe
it's just that I've combed through it so often that I actually understand
what it does!).
Minor problem, however: I started by just creating a vanilla list with
hard-coded values and giving the ID for each level a number. Tested it, and
it worked beautifully. Then I put in the first level of dynamic generation
(at the top level, drawing the category names from the database) and used
the ID number for each category as the ID of the sub-dl. That worked too,
but I realised that if I just used straight numbers, then there would be
problems when I started bringing in more levels of dynamic content since
some ID numbers would be repeated (for example, the number 2 may exist as an
ID number for a Category, a Subcategory and a Section, so there would be 3
instances of ID=2 on the page and that would stuff things up). I figured
that shouldn't be too hard, and with the addition of a little text, I now
had some first-level ID's like Sub1, Sub2, etc. Now, suddenly, the system
stops working!
Can anyone tell me why this should be? Why did it work when the IDs were
just numbers, but stop working when it was a letter-and-number combination?
The example in Zeldman's book uses text as the ID of the section he's
toggling, so I'm sure that the script is meant to work with text.
The script, for those who don't have the book, is as follows:
function toggle(targetID) {
if (document.getElementById) {
target = document.getElementById(targetID);
if (target.style.display == none) {
target.style.display = ;
} else {
target.style.display = none;
}
}
}
Can anyone suggest why I'm having this problem?
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.740 / Virus Database: 494 - Release Date: 16/08/2004
attachment: winmail.dat
RE: [WSG] Can someone help me figure out some semantic mark-up, please?
Well, I've found a way around the problem (used an incrementing counter
instead of the ID-number from the database, so each item has a unique ID) so
this question isn't exactly pressing any more.
I'd still love to know the answer though, if for no other reason than that
there's a good chance I'll use this script again in future and it would be
nice to know in advance if text-ID's are workable.
BTW, in answer to an earlier question about the number of items that will
eventually be in the list, about 98% of the time they will be accessing the
data across the internal network so there is still not going to be too much
of a lag (management has declared it acceptable, anyway, given that it won't
have to happen very often). And front-end users never get a page that
returns all items in the catalogue, so variable connection speeds aren't
really an issue either. :)
Cheers,
Seona.
-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
Sent: Sunday, 29 August 2004 8:50 AM
To: [EMAIL PROTECTED]
Subject:RE: [WSG] Can someone help me figure out some semantic
mark-up, please?
Thanks for the help, guys. I've gone with the dl as suggested by
Mordechai, and the script that was in Zeldman's book (sorry, Mordechai, but
it seemed like a slightly simpler, more flexible way of doing it - or maybe
it's just that I've combed through it so often that I actually understand
what it does!).
Minor problem, however: I started by just creating a vanilla list with
hard-coded values and giving the ID for each level a number. Tested it, and
it worked beautifully. Then I put in the first level of dynamic generation
(at the top level, drawing the category names from the database) and used
the ID number for each category as the ID of the sub-dl. That worked too,
but I realised that if I just used straight numbers, then there would be
problems when I started bringing in more levels of dynamic content since
some ID numbers would be repeated (for example, the number 2 may exist as an
ID number for a Category, a Subcategory and a Section, so there would be 3
instances of ID=2 on the page and that would stuff things up). I figured
that shouldn't be too hard, and with the addition of a little text, I now
had some first-level ID's like Sub1, Sub2, etc. Now, suddenly, the system
stops working!
Can anyone tell me why this should be? Why did it work when the IDs were
just numbers, but stop working when it was a letter-and-number combination?
The example in Zeldman's book uses text as the ID of the section he's
toggling, so I'm sure that the script is meant to work with text.
The script, for those who don't have the book, is as follows:
function toggle(targetID) {
if (document.getElementById) {
target = document.getElementById(targetID);
if (target.style.display == none) {
target.style.display = ;
} else {
target.style.display = none;
}
}
}
Can anyone suggest why I'm having this problem?
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.740 / Virus Database: 494 - Release Date: 16/08/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.740 / Virus Database: 494 - Release Date: 16/08/2004
attachment: winmail.dat
Re: [WSG] Can someone help me figure out some semantic mark-up, please?
On Sunday, Aug 29, 2004, at 09:09 Australia/Sydney, Seona Bellamy wrote: Well, I've found a way around the problem (used an incrementing counter instead of the ID-number from the database, so each item has a unique ID) so this question isn't exactly pressing any more. I'd still love to know the answer though, if for no other reason than that there's a good chance I'll use this script again in future and it would be nice to know in advance if text-ID's are workable. Seona, depending on the doctype you're using, ID's that are just numbers won't validate. They need to start with an alpha character - for XHTML 1 Strict, at least. But there again, if your project is for offline use, maybe validation doesn't matter... ;o) N ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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 **
[WSG] Can someone help me figure out some semantic mark-up, please?
Hi guys, I'm hoping that this doesn't count as off topic, but I need some help figuring out the best way to mark up a section of code. What I need it to do is operate with the toggle DOM script from Zeldman's 'Designing With Web Standards'. I've already used this script successfully on a different part of the site which is only one level deep (this will make sense in a moment) but when I introduce further levels it falls apart and stuffs up the whole page - I can't even view source! What I need to do is have the following sort of setup: Category - Subcategory - Section - Product - Product - Product - Section - Product - Product - Subcategory - Section - Product - Product Category - Subcategory ...etc... When the user first views the page, only the category names are shown. They then select the category they are interested in and click on it, and it shows the subcategories under that category. They click on the subcategory they are interested in, and it displays the sections under that subcategory. They click on the section they are interested in, and it displays the list of products. I know this sounds like a lot of extraneous steps, but it is on the Admin side of the site and it to allow them to easily administer a list of something like 50,000 line items without having to scroll forever or keep going to different pages - the idea with this script is that the page loads with all of the data, but most of it is hidden. Then the changes to the page are made client-side, reducing the number of calls to the server. My client agreed that the extra delay when first loading the page was more than made up for by the reduction in delays when calling up the different records. For anyone who is unfamiliar with the script, the (simple) working version can be seen at: http://216.119.123.23/index.cfm?fuseaction=catalogue.ListProductsSubcat=2c ategory=Subcategory Anyway, what I need is a semantic way of marking up the above structure in such a way that the required nested hiding works. Should I be using divs? Should I be using some other tag? What is the best? I've tried a couple of different ways, and none of them have been successful. I'm figuring that if I start out with properly marked-up code, it might make it easier to slot in the required functionality. Sorry that this has been a little long-winded. Thanks for taking the time to read this far. Even more thanks if you have a suggestion for me. *hint hint* ;) 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.740 / Virus Database: 494 - Release Date: 16/08/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 **
Re: [WSG] Can someone help me figure out some semantic mark-up, please?
El vie, 27-08-2004 a las 10:20, Seona Bellamy escribió: Hi guys, I'm hoping that this doesn't count as off topic, but I need some help What I need to do is have the following sort of setup: Category - Subcategory - Section - Product - Product - Product - Section - Product - Product - Subcategory - Section - Product - Product Category - Subcategory ...etc... How fancy do you want it? I'd say it's simply a set of nested unordered lists (w or w/o headings), but of course you could have a blast with definition lists :) Two sound and simple options here: a) Nested ul ulliCategory ul liSubcategory ul liSection ul liProduct A/li li Product B/li /ul /li !-- section end -- /ul !-- section list end -- /li !-- subcat end -- /ul !-- subcat list end -- /li !-- cat end -- /ul !-- cat list end -- b) Headings + Nested ul hxCategory/hx ul liSubcategory ul liSection ul liProduct A/li li Product B/li /ul /li !-- section end -- /ul !-- section list end -- /li !-- subcat end -- /ul !-- subcat list end -- As for the dynamic part, take a look at: http://www.kryogenix.org/code/browser/aqtree2/ http://www.danwebb.net/lab/archives/18.html -- Manuel trabaja para Simplelógica, construcción web (+34) 985 22 12 65http://simplelogica.net escribe en Logicola http://simplelogica.net/logicola/ ** 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] Can someone help me figure out some semantic mark-up, please?
Seona Bellamy wrote:
Hi guys,
I'm hoping that this doesn't count as off topic, but I need some help
figuring out the best way to mark up a section of code.
snip/
Category
- Subcategory
- Section
- Product
- Product
- Product
- Section
- Product
- Product
- Subcategory
- Section
- Product
- Product
Category
- Subcategory
...etc...
Without question, nested listed are the way to go. I think with this
structure, a dl is more meaningful than a ul (more hooks, too). Sever
side functionality can be added as a back-up for when JavaScript isn't
available (not the case here). To do so all the dt's and the inner most
dd's need to be links (which also allows :hover in browsers with weak
CSS support).
(Note: there might be some typos.)
Key JavaScript:
function clicked(elem) {
if (elem.parentNode.className == closed) {
elem.parentNode.className = open;
} else{
elem.parentNode.className = closed;
}
return false;
}
var expList = document.getElementById(expList);
var headings = expList.getElementsByTagName(dt)
for (var i=0; headings.length i; i++){
headings[i].onclick = clicked(this);
}
Key CSS
.closed dd {
display : none;
}
Key HTML:
dl id=expList
dtCategory/dt
dd
dl
dtSubcategory/dt
dd
dl
dtSection/dt
ddProduct/dd
ddProduct/dd
/dl
/dd
dd
dl
dtSection/dt
ddProduct/dd
ddProduct/dd
/dl
/dd
/dl
/dd
...
**
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] Can someone help me figure out some semantic mark-up, please?
On Friday, Aug 27, 2004, at 18:20 Australia/Sydney, Seona Bellamy wrote: I know this sounds like a lot of extraneous steps, but it is on the Admin side of the site and it to allow them to easily administer a list of something like 50,000 line items without having to scroll forever or keep going to different pages - the idea with this script is that the page loads with all of the data, but most of it is hidden. I agree with Manuel and Mordechai about the approach for structuring the code - but I'll be *really* interested to see how big the final file is, with 50,000 line entries! Something tells me that's going to be quite an initial wait for it to load... Nick ___ Omnivision. Websight. http://www.omnivision.com.au/ ** 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 **
