Displaying a photographic portfolio -...

User 2793720 Photo


Registered User
66 posts

Frank Cook wrote:
There is an item that may match what is wanted at https://mock-up.coffeecup.com/ma-comps/ … llery.html .
Frank


Thank you - i'll give it a go.
User 2793720 Photo


Registered User
66 posts

Steve Sharkey wrote:
Inger wrote:
I'm always testing my stuff on my iPhone in Safari.


So it's probably something I've done because it was definitely showing strangely on the safari browser but fine on all browsers on my laptop.


Try this page:

http://sharkeys.uk/photography-portraits.html

Displays consistently in Chrome, Firefox & Edge (not ie but what do you expect?) and on an Apple device goes a bit screwy. I'm not a keen Apple fan but if you want to reach a wide audience then you do need to test these things...
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

Here is what I see on my iPhone6 using Safari. In landscape orientation, I need to pinch a wee bit, but otherwise, it works.
Attachments:
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 122279 Photo


Senior Advisor
14,447 posts
Online Now

I hadn't read all your posts since my previous one, and also, I was under the impression that you were building with Materialize. Now I see you are using Foundation.

So, regarding image sizes: Nearly all my components need the 'standard' way of sizing images, therefore I haven't mentioned it in particular. By 'Standard' I mean images about as large as the maximum display size you want. It is common sense that if you need an image to display, say, 600x400 px, you take your images of maybe 6000x4000 px (mine are like that right from the camera) through Photoshop or some other photo editing software first, to give them some treatment, maybe cropping, maybe giving the colours a treat, and definitely putting them in an optimum size. In 'the old days', when bandwidth played a more important role, you probably made separate thumbnails. Many people still do that.

The bulk of my components don't need anything special for the images other than the 'standard', but if there IS a need for something special, like e.g. for the parallax components, I do mention it. Also, when using different sizes of an image for different viewport sizes.

I'm trying to explain any 'tricks' used to create the components and how to work with them. Whether my explanations are good enough, will be for others to judge about, and if something seems to be lacking, I would like to be notified, so that I can do something about it.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2793720 Photo


Registered User
66 posts

Inger wrote:
Here is what I see on my iPhone6 using Safari. In landscape orientation, I need to pinch a wee bit, but otherwise, it works.


How odd, attached is what I get on my iPad - now I'm stumped! Can we get a 3rd view?
Attachments:
User 2793720 Photo


Registered User
66 posts

Inger wrote:
I hadn't read all your posts since my previous one, and also, I was under the impression that you were building with Materialize. Now I see you are using Foundation.


I forgot to add.. thank you all for comments/feedback/help
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

Steve, I suppose you have cleared the browser cache on your phone. Another trick might be to load the main.css directly in the phone, and then go back to the page. This is the path to the relevant css file:
https://mock-up.coffeecup.com/f-comps/css/main.css
Loading the css file has helped me in some cases when I had something weird on the screen.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 122279 Photo


Senior Advisor
14,447 posts
Online Now

I have an old iPad that I first needed to recharge. Here are the screenshots of what it shows me. I don't know what else I can suggest. Maybe... have you tried the Foundation Lightbox gallery on the same page?
Attachments:
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2699991 Photo


Registered User
4,782 posts
Online Now

Inger wrote:
I have an old iPad that I first needed to recharge. Here are the screenshots of what it shows me. I don't know what else I can suggest. Maybe... have you tried the Foundation Lightbox gallery on the same page?


looks even worse than that on my 2 mobile devices (OPPO & SAMSUNG, not apple) Google / Firefox / Edge Canary (beta trial version for mobiles)
can hardly see the thumbnails, the first image doesn't show until one clicks on the thumbnail the paragraph overflows causing a scroll bar
and also on my desktop ---large monitor the paragraph stretches right across the width, and the thumbnails are very small, and the 1st gallery image doesn't show until one click on the thumbnail

all in all as I have said before This is one of the most difficult components to work with, even for the experienced.
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 122279 Photo


Senior Advisor
14,447 posts
Online Now

I can probably make the thumbnails somewhat larger. As to seeing the first image on loading, that was not intended. The vertical thingie was actually a quick change of the horizontal one, in which the first, or any image, appears only when selected. But maybe I can have that changed for the vertical one, we'll see...
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com



Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.