Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 158 Stack Exchange communities.

What is meta?
Here's how it works:
  1. Any Stack Exchange user can ask a question
  2. The community provides support, votes on ideas, and reports bugs
  3. Your voice helps shape the way Stack Exchange operates

The scenario:
When I vote for a question, a successful up vote is cast, then I refresh the page. I can't see the up_vote_off image anymore, I immediately see the up_vote_on image.

I checked the response of the main HTTP request for the question and it is off, not on.

So, the on CSS class is being put by Javascript, not generated on the server and being transferred to me, I am amazed (and a little confused) about how can you do that? I mean, there must be even a little gap between the moment, the response is received and the execution of Javascript on the client, but there is no gap. (by gap, I mean that the user sees the off vote image then sees it flip to the on vote image), if this is done by caching, any details please about that? what technique is used? where exactly the vote info is being put?

share|improve this question
up vote 7 down vote accepted

Take a look at this image:

This is the "sprites" for the page. The vote being selected or not is rendered only by the offset into this image via CSS.

You can see more about sprites and CSS with a web search, but the key point is this, you won't see the up vote being "downloaded" in the HTML since it is rendered by a combination of CSS and javascript.

If your machine was slow enough you would see the "delay flicker" but no modern machine would be so slow.

share|improve this answer
No my machine is good, and I said that there is no gap. I'm using a similar approach, but with 2 separate images, and I have a little gap, are you telling me that If I used a full sprite this gap will be gone? – Kenan Deen Oct 26 '11 at 13:47
@LordCover : Yes, as some performance tests would show, changing images is MUCH slower than changing an offset. This is why sprite use has come into vogue. – Hogan Oct 26 '11 at 13:52
@LordCover : Also, make sure you are using DOM ready not page. (cf – Hogan Oct 26 '11 at 13:57

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .