Images sometimes show, sometimes don't

A place for discussion about skinning and design. Before posting questions here you should review the documentation about creating skins.

This thread is closed to new posts. You must sign in to post in the forums.
4/1/2015 2:02:01 PM
Gravatar
Total Posts 2

Images sometimes show, sometimes don't

I'm currently designing some pages for a mobile site using mobilekit pro, and I've run into an issue in which sometimes images will display, and other times they will not. The image is loaded every time (the GET request succeeds) it just won't display on the page. I've isolated the problem to some css that gets added, but I can't seem to find where this takes place in order to fix it. When the image shows up, the tag appears like so:


<img style="max-width: 550px; display: block; margin-left: auto; margin-right: auto; width: 100%; height: 366px;" src="/Data/Sites/1/images/about/staff/staff.jpg" alt="" startwidth="550" startheight="366">

When it does not appear, the tag instead looks like:

<img style="max-width: 0px; display: block; margin-left: auto; margin-right: auto; width: 100%;" src="/Data/Sites/1/images/about/staff/staff.jpg" alt="" startwidth="0" startheight="0">

The issue, it appears, is that the max-width sometimes gets set to 0, which of course will not allow the image to display. The strange thing is that it is completely random which tag decides to show up. My hunch is that it has something to do with the way mobile kit pro attempts to resize images to fit the mobile screen, but I'm unsure why it (a) only happens some of the time and (b) where this resizing occurs.

Any help would be greatly appreciated!

4/1/2015 4:17:06 PM
Gravatar
Total Posts 18444

Re: Images sometimes show, sometimes don't

The layout.master file of the skin has attributes on the <portal:ScriptLoader that tell it to load the script from /ClientScript/jqmojo/jquery.imagefit.min.js

that would be the script that resizes images to fit the screen, it is an older version of imagefit, you could try backing up the file and replacing it with a newer version which you could find via google if you confirm it to be the cause of the problem.

possibly width and height attributes in the raw markup before the js runs may be a factor in what the js does when resizing images.

4/3/2015 11:51:27 AM
Gravatar
Total Posts 2

Re: Images sometimes show, sometimes don't

Hi Joe, I figured it out. It turns out if you don't have width and height specified in the image, the resize function will sometimes treat the image as if its width and height are 0. Specifying a height and width for images in the HTML solves the problem. Still unsure on why it only happens in some cases and not others, but at least I have a workaround. Thanks for the help!

You must sign in to post in the forums. This thread is closed to new posts.