Background image not showing in Firefox when accessed through dev_appserver

11 views
Skip to first unread message

aunindo

unread,
Nov 12, 2008, 1:20:48 PM11/12/08
to Google App Engine
Hi,

In html template, I have some background images through inline css in
the table tag.

style="background-image: url('images/aboout_us.jpeg')"

There four such tables in the template, each one having different
background images, size ranging from 5KB to 60KB.

The images show up properly in Firefox if the page is directly viewed
through file protocol or if accessed from Apache server.
It also shows up properly when accessed from dev_Appserver and viewed
in IE.
But when it is accessed from dev_appserver and viewed in firefox, the
behavior is erratic. All the four images do not show up at the same
time, and on repeated refresh of the browser, none, any one or more of
the images will show up and others would not show. Out of the four
anyone can show up and there is no co-relation with the size of the
image.

Evidently it is not a coding error, as the behavior is not consistent.
My hunch is that it is something to do with how firefox is requesting
for the images and how dev_appserver is responding to the same.

From the debug messages on the dev_appserver, the GET of the images
do now show up in a regular order when accessed from firefox. But it
is very consistent and properly ordered, when accessed from the IE.

Can anyone please help me in understanding what is happening and what
might be the remedy?

Thanks in advance.

Sylvain

unread,
Nov 12, 2008, 2:59:14 PM11/12/08
to Google App Engine

aunindo

unread,
Nov 12, 2008, 9:39:16 PM11/12/08
to Google App Engine
Thanks for the advice, but setting default_expiration does not help.
The behavior is still erratic irrespective of expiration value, be it
1 second or 1 day.

On Nov 13, 12:59 am, Sylvain <sylvain.viv...@gmail.com> wrote:
> http://code.google.com/appengine/docs/configuringanapp.html#Static_Fi...

TLH

unread,
Nov 13, 2008, 7:59:24 AM11/13/08
to Google App Engine
I cannot reproduce your results.

I am using Firefox 3.0.3 on Ubuntu.

Here is my app.yaml:

---- snip ----
application: cssurl
version: 1
api_version: 1
runtime: python

handlers:
- url: /stylesheets
static_dir: stylesheets

- url: /images
static_dir: images

- url: /.*
script: cssurl.py

---- snip ----

here is my stylesheet:

---- snip ----

div#one {
background-image: url('/images/one.jpeg')
}
div#two {
background-image: url('/images/two.jpeg')
}
div#three {
background-image: url('/images/three.jpeg')
}
div#four {
background-image: url('/images/four.jpeg')
}

div.imgrow div {
width: 192px;
height: 256px;
float: left;
}

div.imgrow {
width: 800px;
height: 280px;

}

div#footer {
clear: both;
}

---- snip ----

Here is my template, index.html:

---- snip ----
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link type="text/css" rel="stylesheet" href="/stylesheets/
style.css" />
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>css background images</title>
</head>
<body>
<div class="imgrow">
<div id="one">
one
</div>
<div id="two">
two
</div>
<div id="three">
three
</div>
<div id="four">
four
</div>
</div>
<div id="footer">
Ta-daa!
</div>
</body>
</html>
---- snip ----

Here is my handler:

---- snip ----

import os
from google.appengine.ext.webapp import template
from google.appengine.ext import webapp
from google.appengine.ext.webapp.util import run_wsgi_app

class MainPage(webapp.RequestHandler):
def get(self):
template_values = {
}

path = os.path.join(os.path.dirname(__file__), 'index.html')
self.response.out.write(template.render(path,
template_values))


application = webapp.WSGIApplication(
[
('/', MainPage),
],
debug=True)

def main():
run_wsgi_app(application)

if __name__ == "__main__":
main()

----snip----

Does this work for you?
Reply all
Reply to author
Forward
0 new messages