Wow! Thanks (as always) Karl! I don't know why that CSS method didn't smack me over the head :oP Thanks for the words of wisdom and time to help. Its very much appreciated.
-- Brian On Jan 16, 3:47 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote: > HI Brian, > > One way to do this is to use absolute positioning for the "initial" > and "replaced" elements and relative positioning for the "replacing" > div. You'll want to set a min-height on the "replacing" div so things > look right. (Note: you can use height rather than min-height in an IE6- > only stylesheet to get it to work with IE6 as well.) Also, rather than > using setTimeout with a time of zero, you can just bind the function > to $(window).load(); > > I copied your page and modified it as described above. You can check > it out here: > > http://test.learningjquery.com/replace-element.html > > --Karl > _________________ > Karl Swedbergwww.englishrules.comwww.learningjquery.com > > On Jan 16, 2008, at 11:53 AM, Brian Talbot wrote: > > > > > As an update, I've gotten the functionality to work. :o) > > > But the behavior isn't completely correct. Ideally, the initial > > element (<div class="initial"></div>) would fade out with the > > replaced element (<div class="replaced"></div>) being visually > > directly behind it and becoming more visible as the initial element > > fades out. > > > Does anyone have any experience or ideas for how to make that > > specifically happen? > > > On Jan 16, 9:31 am, Brian Talbot <[EMAIL PROTECTED]> wrote: > >> Hi All, > > >> I'm still getting my feet wet with JQuery and am having some trouble > >> trying to accomplish the following: > > >> I'd like to have one HTML element (in the case of the example below > >> its a <div class="initial"></div>) be replaced by another HTML > >> element > >> (again in this case its <div class="replaced"></div>) when the page/ > >> DOM containing these elements is loaded. Additionally, I'd like the > >> initial element (<div class="initial"></div>) to fade out visually > >> and > >> the replaced element (<div class="replaced"></div>) to be present > >> visually behind it as it fades out. > > >> * I've got an example of what I've done so far here > >> -http://www.brian-talbot.com/inventingroom/replacing-content-on-load/ > > >> * You can view the JQuery JS I've tried to cobble together here > >> -http://www.brian-talbot.com/inventingroom/replacing-content-on-load/j > >> ... > > >> If you know of anything I'm doing terribly wrong or a better way to > >> generally achieve this behaviro, please let me know. Any help is much > >> appreciated.