Desktop vs Mobile
Permalink Browser Info Environment
Hi.
A couple of questions if I may.
1: Looking at the sample sites that are using this theme when viewed on a mobile device the fullscreen photos appear to crop at the sides to accommodate the change in dimensions. Using the home page of this site as an example -http://backtobacktheatre.com - the images scale to fit in their entirety. Is it possible to achieve this with Long Story Short?
2: I want to create a three page website, page one is the landing page with two menu selections to take you to the two scrolling pages. Page two and three will have multiple slides (say 5-6) each. I would like to have the ability to show only the menu for the slides on each page as well as the menu link to the other page (1 or 2), is this possible?
Best,
Jac
A couple of questions if I may.
1: Looking at the sample sites that are using this theme when viewed on a mobile device the fullscreen photos appear to crop at the sides to accommodate the change in dimensions. Using the home page of this site as an example -http://backtobacktheatre.com - the images scale to fit in their entirety. Is it possible to achieve this with Long Story Short?
2: I want to create a three page website, page one is the landing page with two menu selections to take you to the two scrolling pages. Page two and three will have multiple slides (say 5-6) each. I would like to have the ability to show only the menu for the slides on each page as well as the menu link to the other page (1 or 2), is this possible?
Best,
Jac
| Type: | Pre-Sale |
|---|---|
| Status: | In Progress |
1. You're right, by default slides are full width and full height, and background images get cut off in order to cover the entire slide area.
In your example site, the images are full width and full height on desktop, but not on mobile. On mobile they are full width, but the height is proportional to the image size, so images are not cropped.
I've created a quick demo to see if this could be achieved using the theme:
http://longstoryshort.15robots.com/resize-mobile...
To achieve that, I've added a Custom Class to the 1st and 3rd slides ("resize-on-mobile") and then I've added the following CSS code (Design > Theme > Customize > Custom CSS):
Thanks to that code, on mobile slides are no longer full height, but they keep the original image proportion.
So yes, it should be possible to achieve that, but with some tweaking.
2. The top Nav Bar has two different areas on the right:
the "Site Nav" area is a global area that's visible on all pages.
the "Slides Nav" area is a page-specific area that's only visible on the current page.
Here you can see a screenshot:
http://concrete5.15robots.com/tutorials/getting-started-long-story-...
So you could use the "Slides Nav" area to display the menu for the slides on each page, and the "Site Nav" area to display the links to the other pages.
Hope this helps (sorry for the lengthy answer!)
Jordi