fixed image size (project page)

[danny]

Thanks @Richard! Will try to sort it out. All best wishes Daniel

[danny]

Dear @Richard,

thanks again, maybe we didn't explained well enough yet what we achieve.

We would like that the Page "https://www.marthekrueger.com/work/" functions like this website: http://www.nofoundry.xyz/

So yes, we achieving horizontal and vertical scrolling.

Do you have any idea?

Thanks a lot! Appreciate it very much.

All best wishes

Daniel

[Richard]

Dear Daniel

@danny

Not possible with current laytheme options sorry, this will need to be custom coded. The main area of the example website has the id all . Here the CSS added forces dimensions off the browser screen ( width 10000px ).

#all {
    height: 10000px;
    width: 10000px;
    position: relative;
}

You could apply your own custom css to Lay Theme adding these big dimensions. Another option could be to use the Fullscreen Slider for downwards scrolling and carousels on each row for horizontal scrolling but this is still restricted movement. Not as free moving as the example http://www.nofoundry.xyz/

---

Best wishes Daniel and talk soon 🌝

Richard

[danny]

Dear @Richard,

thanks, I applied the CSS, unfortunalty it wont affect the website.

Do you might know what I would miss?

Thanks again and have a nice day.

Best wishes

Daniel

[danny]

… and one more example website for what we achieve: https://www.lutzbacher.com/8.html

Greetings!
D

[Richard]

Dear Daniel

@danny

Likely you do not have an HTML element within your website with the id 'all' - #all The above CSS is being applied to whatever has the id 'all' .

The example provided does the same thing by defining the 'background' container to have a large width and height:

The CSS:

#background {
    margin: 0px auto 0 px auto;
    visibility: visible;
    height: 2942px;
    width: 4000px;
    position: relative;
    background-color: #FFFFFF;
    background-image: none;
}

---

If you would like to apply similar CSS you must define an ID or Class for the CSS to be applied to.

#my-custom-id{
width:4000px;
height:2000px;
}

For example, within the Gridder i can click an element and define a custom Id or Class for it:

Now with the above code added within > Lay Options > Custom CSS & HTML > My text element in the Gridder will be given a height of 2000px & a width of 4000px.

https://laytheme.com/documentation.html#custom-css-styling

https://www.khanacademy.org/computing/computer-programming/html-css

https://www.khanacademy.org/computing/computer-programming/html-css/web-development-tools/a/using-the-browser-developer-tools

---

Hope this helps Daniel & best wishes 🌝

Richard

[danny]

Dear @Richard,

thanks a lot for this and sorry for my late reply.

I tried it out - it actually works with websites that are not build with Laytheme but with Laytheme it does not work. The Custom CSS seems to crash with the actual laytheme code.

Would you know of any other website that is build with laytheme that features infinitive horizontel and vertical scrolling?

Many thanks! Appreciate your help a lot!

All best wishes

Daniel

[Richard]

Dear Daniel

@danny

"Would you know of any other website that is build with laytheme that features infinitive horizontel and vertical scrolling?"

Not off the top of my head sorry but i would imagine it makes use of Carousel and Fullscreen Slider addon's both active and set to "loop" creating the infinite experience.

---

Best wishes 🌝

Richard

[danny]

Dear @Richard,

many thanks - now how do you mean exactly with Carousel and Fullscreen Slider set to "loop"?

Would it be possible that I provide you with the login data and you could have a look yourself?

I know thats not the usual - I just thought it might be a benefit, cause in the end this infinite vertical and horizontal screening can be useful for other users as well I believe.

Many thanks!

Best wishes
Daniel

[danny]

Dear @Richard,

did you saw my last reply?

Thanks!

Best wishes

Daniel

[Richard]

Dear Daniel

@danny

Sorry for delay💥
Setting the Carousel or Fullscreen Slider to Loop can be done within the Settings of either the Carousel Addon or Fullscreen Slider Addon.

Here for the Fullscreen Slider Addon - "Continous Vertical":

And for the Carousel Addon - "Loop Slides":

When adding a Carousel into the Gridder you will see the "Loop" Option:

---

Hope this helps & best wishes, have a great day Daniel 🌻

Richard

[danny]

Dear @Richard,

thanks a lot. I tried the Fullscreen Slider Addon. But as far I understand this is for single images as a Slideshow? It's turning the images into into single slides (see below), thats unfortunalty not something we looking for.

As we would like to achieve a vertical and horizontal scrolling of the page https://www.marthekrueger.com/work/. So we would need a scroll bar vertical and horizontal as in this example website here http://www.nofoundry.xyz/.

I'm happy to provide you with the logins for the website and you could maybe try it out?

Thanks again for your help! All best wishes Daniel

[Richard]

Dear Daniel

@danny

The Fullscreen Slider creates it's "Slides" based on the "row". Unfortunately as a Forum helper I cannot go as far as design your website for you - If you would like these designs as per example you will have to find a solution or ask the aid of a Developer.

A true 10000 pixel wide/high webpage like your example will need to be custom coded. If you want to use standard Lay Theme options to achieve a similar but not the same design then use the Fullscreen Slider for vertical movement & the carousel within a Row for horizontal movement.

---

Best wishes Daniel 🌝

Richard