On May 13, 10:21 am, Wizzud <[EMAIL PROTECTED]> wrote: > Sounds to me like you should be considering rewriting your wrapping code to > traverse the dom tree below the target div, rather than treating the whole > inner html as a single element. This would solve your problem of not > wrapping things like form elements, etc, and would mean that you were > actually doing lots of replaces but only on text nodes, which (presumably) > has less chance of clashing with your animations. Also, any changes become > progressive rather than all-at-once. Since you don't give any indication of > what these animations might be, or why they are needed to run from page > load, its difficult to determine the level of interference.
Thanks for the reply, but I don't think you've quite understood the problem I'm having. I have a senario where there are two functions attached to $ (document).ready - One function sets teh AJAX request for keywords in motion, the other one starts animations running on the page. The problem occurs when the AJAX request completes and the div innerHTML replace occurs while the animation is part way through the process of running. All kinds of nasty side-effects occur when this happens, in all my test browsers. The most obvious one is that the animations stall before completing. I also seem to get other odd side effects, like the .ready event seems to keep firing over and over and sends the browser CPU usage through the roof until I unload the page. As these problems happen in all browsers I'm assuuming it's my fault. I think messing around with the .html or .text properties of the nodes directly would just cause the above described behaviour to manifest itself again. even if it didn't then I doubt it'd work in safari. Granted the current version doesn't either but that is a problem I would love to solve. I suspect doing proper DOM traversal and node creation is the right way to go but I don't know if your posted code is the way to go. What I think I need to do is: If the node is a text node 1) Locate a keyword inside a text node. 2) If I find it, then create a new text node that contains everything up to the match. 3) Create a hyperlink node after the first text node that contains a text node rquivilant to my match. 4) create another text node after the hyperlink node that contains all the text that follows on from after the keyword to the end of the text node. 5) Set the newly created hyperlink's href, events, etc Repeat the process on the newly created text node that follows the newly created hyperlink so that I catch all occurances If the node is something other than a text node and is not a node of a type I don't want to do matching inside (hyperlink, form control, script etc) then examine the children of that node recursivly and do the hyperlink creation process on them. However, there is also time pressure and until I can rewrite the code to work in a proper DOM friendly way, a simple fix to stop the two scripts from tripping over each other will do. As the innerHTML replacement during an animation seems to trigger the problem what I need is something like this: Each script checks for the other's presence. If the animation script fails to find the innerHTML script then create your own document.ready event. If you do find the innerHTML script then do nothing. If the innerHTML script finds the animation script then create a ready that fires the ajax process and which on completion does the search and replace first, then starts the animations once this is complete. If it doesn't find the animation script then it simply does the AJAX stuff on document.ready.