Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. General Discussion
  3. fixed image size (project page)

fixed image size (project page)

Scheduled Pinned Locked Moved General Discussion
22 Posts 2 Posters 1.4k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • D Offline
    D Offline
    danny
    wrote on last edited by
    #13

    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

    Bildschirmfoto 2021-10-27 um 11.43.23.png

    1 Reply Last reply
    0
    • D Offline
      D Offline
      danny
      wrote on last edited by
      #14

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

      Greetings!
      D

      1 Reply Last reply
      0
      • RichardR Offline
        RichardR Offline
        Richard
        Global Moderator
        wrote on last edited by
        #15

        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:
        Screen Shot 2021-10-29 at 11.09.56 AM.png

        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:
        Screen Shot 2020-11-13 at 9.07.33 AM.png

        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
        1 Reply Last reply
        0
        • D Offline
          D Offline
          danny
          wrote on last edited by
          #16

          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

          1 Reply Last reply
          0
          • RichardR Offline
            RichardR Offline
            Richard
            Global Moderator
            wrote on last edited by Richard
            #17

            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
            1 Reply Last reply
            0
            • D Offline
              D Offline
              danny
              wrote on last edited by
              #18

              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

              1 Reply Last reply
              0
              • D Offline
                D Offline
                danny
                wrote on last edited by
                #19

                Dear @Richard,

                did you saw my last reply?

                Thanks!

                Best wishes

                Daniel

                1 Reply Last reply
                0
                • RichardR Offline
                  RichardR Offline
                  Richard
                  Global Moderator
                  wrote on last edited by
                  #20

                  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":
                  Screen Shot 2021-12-02 at 10.11.34 AM.png

                  And for the Carousel Addon - "Loop Slides":
                  Screen Shot 2021-12-02 at 10.11.24 AM.png

                  When adding a Carousel into the Gridder you will see the "Loop" Option:
                  Screen Shot 2021-12-02 at 10.13.54 AM.png


                  Hope this helps & best wishes, have a great day Daniel 🌻
                  Richard
                  1 Reply Last reply
                  0
                  • D Offline
                    D Offline
                    danny
                    wrote on last edited by
                    #21

                    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

                    Bildschirmfoto 2021-12-02 um 10.15.39.png

                    1 Reply Last reply
                    0
                    • RichardR Offline
                      RichardR Offline
                      Richard
                      Global Moderator
                      wrote on last edited by Richard
                      #22

                      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
                      1 Reply Last reply
                      0
                      Reply
                      • Reply as topic
                      Log in to reply
                      • Oldest to Newest
                      • Newest to Oldest
                      • Most Votes


                      I also code custom websites or custom Lay features.
                      πŸ’Ώ Email me here: πŸ’Ώ
                      info@laytheme.com

                      Before you post:
                      1. When using a WordPress Cache plugin, disable it or clear your cache.
                      2. Update Lay Theme and all Lay Theme Addons
                      3. Disable all Plugins
                      4. Go to Lay Options β†’ Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

                      This often solves issues you might run into

                      When you post:
                      1. Post a link to where the problem is
                      2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
                      3. If the problem is difficult to explain, post screenshots / link to a video to explain it
                      Online Users
                      A
                      alasdair17
                      Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
                      laytheme.com
                      • Login

                      • Don't have an account? Register

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Recent
                      • Tags
                      • Popular
                      • Users
                      • Search