Topic: Galleries not displaying correctly on iPhone

Hello

I've just upgraded my galleries to version 2.1.2 in the hope they would display on the iphone etc. They do now show but they do not function well at all.

Hopefully it is something simple in my code that's wrong, If anyone could be kind enough to take a look and spot the problem that would be great

http://stevesharpphotography.com/wheels … index.html

Cheers

Re: Galleries not displaying correctly on iPhone

Why are you using both the old and new embed code?
the old:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script> 
<script type="text/javascript"> 
var flashvars = {};
flashvars.galleryURL = "gallery.xml";
var params = {};
params.bgcolor = "000000";
params.allowfullscreen = true;
params.allowscriptaccess = "always";
swfobject.embedSWF("simpleviewer.swf", "flashContent", "755", "560", "9.0.124", false, flashvars, params);
</script> 

New embed code:

<script type="text/javascript" src="svcore/js/simpleviewer.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function () {
SV.simpleviewer.load("sv-container", "755", "560", "000000", true );
});
</script> 
<div id="sv-container"></div>
Mike Richards
SimpleViewer Support Team.

Re: Galleries not displaying correctly on iPhone

Tbh, I am not great at code (obviously!) and I did not know I was using old and new. Do you think this could be the problem? Should I embed this new code in place of the old as above?

Thanks Mike
Steve

Re: Galleries not displaying correctly on iPhone

Try the following and clear your browser's cache.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> 
<style type="text/css"> 
html,body{
    height:100%;
    margin:0;
    padding:0;
    background-color: #000000;
}
body{
    min-width:800px;
    min-height:650px;
    background-image: url(../images/background.png);
    background-repeat: repeat;
}
#vertical{
    float:left;
    height:50%;
    margin-top:-322px;
    width:100%;
}
#gallwrapper {
    height: 560px;
    width: 755px;
    position: static;
    margin-top: 25px;
    margin-left: 10px;
}
#hoz {
    width:800px;
    margin-left:auto;
    margin-right:auto;
    height:650px;
    overflow:auto;
    text-align:left;
    clear:both;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    background-image: url(../images/bkg-1.png);
}
#hoz img {
}
#navwrapper {
    height: 30px;
    width: 276px;
    position: static;
    margin-top: 5px;
    margin-left: 10px;
}
</style> 
 
<title>Steve Sharp Photography | Wheels Gallery</title> 
<style type="text/css"> 
<!--
-->
</style> 
<script type="text/javascript"> 
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
 
function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}
 
function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script> 
</head> 
<body onload="MM_preloadImages('../images/homeup.png','../images/portfolioup.png','../images/contactup.png','../images/blogup.png')"> 
<div id="vertical"></div> 
<div id="hoz"> 
  <div id="navwrapper"><a href="../index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','../images/homeup.png',1)"><img src="../images/homedown.png" alt="home" width="69" height="30" border="0" id="Image1" /></a><a href="../portfolio.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','../images/portfolioup.png',1)"><img src="../images/portfoliodown.png" alt="portfolio" width="69" height="30" border="0" id="Image2" /></a><a href="../contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','../images/contactup.png',1)"><img src="../images/contactdown.png" alt="contact" width="69" height="30" border="0" id="Image3" /></a><a href="http://stevesharpphotography.wordpress.com/" target="_blank" onmouseover="MM_swapImage('Image4','','../images/blogup.png',1)" onmouseout="MM_swapImgRestore()"><img src="../images/blogdown.png" alt="blog" width="69" height="30" border="0" id="Image4" /></a></div> 
  <div id="gallwrapper"><script type="text/javascript" src="svcore/js/simpleviewer.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function () {
SV.simpleviewer.load("sv-container", "755", "560", "000000", true );
});
</script> 
<div id="sv-container"></div></div> 
</div> 
</body> 
</html>
Mike Richards
SimpleViewer Support Team.

Re: Galleries not displaying correctly on iPhone

Thank you Mike for the clean looking code.

I have done that now and it still looks the same on the iphone. What's happening is that the images do not fit the display area and you can't scroll up or down to view the images, you can scroll left or right though. Am I correct in assuming that the images/gallery are able to shrink to fit the size of the viewing screen?

Re: Galleries not displaying correctly on iPhone

The gallery does it's best to fit everything to the screen, but in some case there is some extra space in there and you will have to scroll down to see the gallery. You gallery/the page looks fine on my Palm Pre, it starts out small with a lot of extra space around your site design I have to scroll down a little to see everything. When I click on a thumbnail the image mostly fills the screen, with some space being taken up by your menu. Have you tried viewing a gallery on your iphones without other website pieces in it? Is that more of what you were expecting?

For example: http://www.simpleviewer.net/simpleviewe … es/modern/

Mike Richards
SimpleViewer Support Team.

Re: Galleries not displaying correctly on iPhone

I'd not actually tried that, looking at that example it is much better although it still does not fit the whole picture in the viewing area and I am unable to scroll down to see the 'missing' bit, also not able to pinch the screen to make it the image smaller.

I guess with the combination of my site design and viewing device I have achieved the best I can.

Thank you once again for you help.