Very nice...I pasted your code below into Homesite and it worked like a charm...I guess I just need to dress it up and check out how you worked with your DIV's.
That's a great way to get a lot of information on a page. I guess I could put forms into those DIV's and have sections for "Update Client Info" "Delete Client" or "Add Client" and instead of sending a user to various pages to complete forms and perform the functions, they could do it right in the DIV's and expand / collapse as needed. Any reason that wouldn't work? One reason I ask is that I'm working on an internal office application to replace some software an insurance company was unhappy with...the software was just too complicated for the simple tasks they wanted to perform. They asked me to write an app that performed the tasks they needed in an "understandable" manner. I've been looking for ways to consolidate adding, updating, and deleting into a single page. This looks like it has potential to do that. Rick > -----Original Message----- > From: Matthew Walker [mailto:[EMAIL PROTECTED] > Sent: Thursday, October 27, 2005 10:43 PM > To: CF-Talk > Subject: RE: Inline frames a good alternative for creating web > applications? > > > > Did you make the sections on the pages > > collapsible with JS? > > Yes. The JS below is included in an external JS file. The HTML code > below is wrapped up as a CF custom tag where "myUniqueId" is a tag > attribute. The attribute needs to be unique for each box or JS doesn't > know which one you are referring to. The code assumes you have two > images: collapsed.gif and expanded.gif but will run without them. When > you click the title bar, three things are toggled: the visibility of the > box, the arrow image's src attribute, and the arrow image's title > attribute. The code below will work as is -- just paste into HomeSite. > > Here's what happens: when you click on the Title DIV the onclick() event > occurs and the toggleDisplay() function runs. The first line of the > function puts the div called "myUniqueId" in a variable. This is just to > save typing. You could replace all the "obj"s with > "document.getElementById(id)". > > We determine whether the box is currently expanded or collapsed by > looking at the DIV tag's display style. If it's set to none, then the > box is currently hidden so we should expand it, and vice versa. > > splitSrc is all about chopping up the URL of the image so we change the > name of the image but still keep the path to the image. Toggling the > image makes the code a bit harder to follow. We take the image path and > split it into an array. The last entry in the array is either > "collapsed.gif" or "expanded.gif". > > The if clause is where we actually start changing things. > obj.style.display sets the visibility of the box. > splitSrc[splitSrc.length-1] sets the last entry in the array > representing the image path. arrow.title sets the IMG tag's title > attribute. > > Finally, we turn the array representing the image path back into a > string with join() and set the IMG tag's src attribute to the new value. > > <script> > function toggleDisplay(id) { > var obj = document.getElementById(id); > var arrow = document.getElementById(id + "_arrow"); > var expanded = obj.style.display != "none"; > var splitSrc = arrow.src.split("/"); > if ( expanded ) { > obj.style.display = "none"; > splitSrc[splitSrc.length-1] = "collapsed.gif"; > arrow.title = "Expand"; > } > else { > obj.style.display = "block"; > splitSrc[splitSrc.length-1] = "expanded.gif"; > arrow.title = "Collapse"; > } > arrow.src = splitSrc.join("/"); > } > </script> > > > <div style="width : 200px; height : 200px"> > <div style="background-color : #999999" > onclick="toggleDisplay('myUniqueId')"> > Title > <img id="myUniqueId_arrow" title="Collapse" > src="arrow_expanded.gif"> > </div> > <div id="myUniqueId" style="background-color : #cccccc"> > lorem ipsum > </div> > </div> > > > ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~| Find out how CFTicket can increase your company's customer support efficiency by 100% http://www.houseoffusion.com/banners/view.cfm?bannerid=49 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:222527 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations & Support: http://www.houseoffusion.com/tiny.cfm/54
