Hi, > Are there any guides to the style of markup and coding that Prototype > assumes?
Prototype doesn't assume or require any markup or particular coding style. Just about the only thing Prototype requires is that you declare a doctype in your document so IE behaves (vaguely) correctly. What I was pointing out on the UL thing is that you currently have this structure: ul li li ul li li ...which means you have a UL as a *direct child* of a UL, which is not valid HTML (see the previous validator link). As for the other, all I was saying was that if doc.gif could be the background image on the LI rather than inline content, it would reduce the size of your markup and it would mean that the only content in the LI was the content you wanted to edit -- and so you could do that directly. Your original idea of using SPANs will work fine if there's other stuff in the LI you don't want to edit. HTH, -- T.J. Crowder tj / crowder software / com Independent Software Engineer, consulting services available On Mar 14, 6:18 pm, "P. Douglas Reeder" <reeder...@gmail.com> wrote: > I'm not clear on what you're suggesting I do with the <ul> elements > inside <li> elements -- Element#update would replace them, and if you > move the <ul> elements outside the <li> elements it's no longer valid > HTML (as I think you meant). > > I should have noted that elements with the class "toggle" are used to > open and close (expand and contract) items in the tree. They don't > have to be images, but some tag in each <li> has to be usable to open > and close items. > > Are there any guides to the style of markup and coding that Prototype > assumes? The API docs cover what each function does individually, and > contain some useful examples, but it's far from clear how to use > different parts of Prototype together. > > On Mar 14, 6:38 am, "T.J. Crowder" <t...@crowdersoftware.com> wrote: > > > Another option would be to > > remove those images from within the list items; instead, make them the > > background graphic on the li. E.g., this: > > > <li><img class='toggle' src="doc.gif" alt="">Tags, Tags, Tags</li> > > > becomes: > > > <li>Tags, Tags, Tags</li> > > ... > > That lets you use Element#update on the li element directly without > > having to worry about the image, as well as saving you a fair bit of > > repeated markup. Another nice thing about using background images for > > this sort of thing is that you can toggle the image easily by changing > > the class of the li -- for instance, to show plus.gif or minus.gif > > depending on whether things are expanded. Downside (you knew there'd > > be one) is that the background image can't take focus for the purposes > > of keyboard navigation. There are ways to handle that, though. In a > > lightweight tree I did recently, I was able to make the first line of > > the node a link that also did the expand/contract, for instance, which > > provided a nice big mouse target and also a keyboard mechanism. > > Obviously your click-and-edit means you wouldn't do quite the same > > thing in this case, but FWIW... > > > (An OT point: I'm not at all sure UL is allowed as a direct child of > > UL; certainly not in XHTML transitional. Might be worth rejigging a > > bit. http://validator.w3.org/isuseful.) > > --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to email@example.com To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~----------~----~----~----~------~----~------~--~---