?
Solved

innerHTML causes flashing

Posted on 2005-03-07
8
Medium Priority
?
564 Views
Last Modified: 2008-03-03
I am using document.getElementById("chat_dump").innerHTML = content   in a timeout loop to continually update a div area:

<div id="chat_dump"></div>

The problem is on FireFox there is an annoying flash even when the content hasn't changed.


0
Comment
Question by:drew22
7 Comments
 
LVL 32

Accepted Solution

by:
Batalf earned 2000 total points
ID: 13479179
You should check if the new content is equal to the existing content before you update it.

if(document.getElementById("chat_dump").innerHTML != content){
    document.getElementById("chat_dump").innerHTML = content;
}

I guess it's not much to do with the flashing in Firefox.

0
 
LVL 1

Author Comment

by:drew22
ID: 13479385
but the content will likely be changing often (it's a chat).
0
 
LVL 4

Expert Comment

by:lotsofish
ID: 13480185
But if the content doesn't change, and the timer timesout, you are getting a flash, so you should check to see if the content has changed before try to update it.
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
LVL 1

Author Comment

by:drew22
ID: 13480635
it flashes when the content changes, too.   And even when content doesn't changed, what's returned by getElementById().innerHTML isn't character-for-character exactly the same as what's read from storage.
0
 
LVL 32

Expert Comment

by:Batalf
ID: 13480786
Maybe you could just append the new data to the existing div

example:

if(cWindow.document) //Moz 0.9+, Konq, Safari, IE, Opera
      cDocument = cWindow.document;
    else //Moz < 0.9 (Netscape 6.0)
      cDocument = cWindow.contentDocument;
}
var newMessage = cDocument.createElement('DIV');
newMessage.innerHTML = newContent; // The new content to the chat
document.getElementById("chat_dump").appendChild(newMessage);

Look at the example at http://code.jenseng.com/jenChat/  for more info.
0
 
LVL 1

Author Comment

by:drew22
ID: 13481101
I think I'll try a pure DOM approach like:
document.getElementById("chat_dump").firstChild.data      = new_data;

...but using the doc fragment (or whatever its called) which can handle html

      
0
 
LVL 11

Expert Comment

by:raj3060
ID: 15614021
No comment has been added to this question in more than 21 days, so it is now classified as abandoned..
I will leave the following recommendation for this question in the Cleanup topic area:

Accept: Batalf

Any objections should be posted here in the next 4 days. After that time, the question will be closed.

-raj-
EE Cleanup Volunteer
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

621 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question