CODEWITHSUNDEEP
jqueryimagemobilejquery-mobile
Damian
Damian

Reputation: 1720

jquery mobile images not displaying

I've been working on my first JQM site and am just putting it live but have a big problem. On my test site the images all display fine but on my live site they do not display.

If I look at the HTML the image source is

img src="path/to/image.jpg"

If I use firebug in FireFox to look at the image source it is

img src="http://www.mysite.com/myCategorypath/to/image.jpg"

So it looks like something is adding the full path to the beginning of the image source url.

Could it be JQM doing this? I'm unsure because the images display fine on my test site. One thing I've noticed is if I hit the browser refresh the images appear.

I'm really stuck as to how I can fix this. Can anyone suggest anything I can look at?

EDIT: It looks like it definitely is JQM doing this because if I remove JQM from the server all my images display correctly and the image url doesn't get amended. Any ideas how I can stop JQM messing with the image path?

Upvotes: 1

Views: 4346

Answers (2)

Damian
Damian

Reputation: 1720

I have a fix! The reason my images weren't displaying is because I am re-writing my URLs so the browser shows www.mysite.com/myCategory, JQM was incorrectly prefixing my images with www.mysite.com/myCategory but the REAL url is www.mysite.com/index.php?path=xxx

To fix the problem, generate image source with a leading slash as img src="/path/to/image.jpg" rather than img src="path/to/image.jpg"

Upvotes: 3

HansElsen
HansElsen

Reputation: 1753

This is just a hunch, but maybe it happens because you're using relative paths? Maybe you can try absolute paths like:

img src="path/to/image.jpg"

I know from experience that JQuery Mobile can be picky on relative paths so all my css/js/html references are absolute.

Upvotes: 0

Related Questions