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. Split screen page problem

Split screen page problem

Scheduled Pinned Locked Moved General Discussion
3 Posts 2 Posters 286 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.
  • I Offline
    I Offline
    igawu
    wrote on last edited by
    #1

    Hi,
    I managed to make a specific pages on my website as a splitview editing a code put in your tutorial (thank you for it!):
    https://laytheme.com/tutorials/create-a-splitscreen-website.html
    by replacing #footer-region with self added HTML tags.
    With this solution, I do not have to set a footer, and I can just use a specific row and make it sticky on the right, ale the rows below are the left part of the page and can be scrolled.

    Sample:

    #grid .photo, .photo2 {
            width: 50%;
            height: 100%;
            position: fixed;
            top: 0;
            overflow-y: scroll;
            overflow: -moz-scrollbars-none;
            scrollbar-width: none;
            -webkit-overflow-scrolling: touch;
        }
         #grid {
            left: 0;
        }
        .photo, .photo2 {
           right: 0;
        }
        ::-webkit-scrollbar {
            display: none;
        }
    

    But as on my "works" page I would like use the same effect like the one used in the tutorial – when on a mouseover I can switch between my works and scroll the specific one:
    https://hedixandt.com

    I tried everything, but the tutorial only shows how to do the footer (the left) part. Can someone help me how the right half of the sample was made? I tried everything. The tutorial only said "The right half is our normal content.". What is a normal content? :)

    And additional question:
    Even if I made it, is it possible to use it only on a specific page, not as a footer for all the pages?

    Thank you for any help!
    Iga

    p.s. the page is a mess at this moment, in the maintenance mod, so I can't linked it

    1 Reply Last reply
    0
    • arminunruhA Offline
      arminunruhA Offline
      arminunruh
      Global Moderator
      wrote on last edited by
      #2

      soo

      im not sure if i understand the question

      But as on my "works" page I would like use the same effect like the one used in the tutorial – when on a mouseover I can switch between my works and scroll the specific one:

      on mouseover, the imagehover addon is used.
      if you have the imagehover addon you can assign images that show up when you hover over a link.
      in lay options → imagehover addon

      you can set the options for it to have an effect like this:
      https://www.instagram.com/reel/Ci8MshfDE7J/?igshid=YmMyMTA2M2Y=

      I 1 Reply Last reply
      0
      • arminunruhA arminunruh

        soo

        im not sure if i understand the question

        But as on my "works" page I would like use the same effect like the one used in the tutorial – when on a mouseover I can switch between my works and scroll the specific one:

        on mouseover, the imagehover addon is used.
        if you have the imagehover addon you can assign images that show up when you hover over a link.
        in lay options → imagehover addon

        you can set the options for it to have an effect like this:
        https://www.instagram.com/reel/Ci8MshfDE7J/?igshid=YmMyMTA2M2Y=

        I Offline
        I Offline
        igawu
        wrote on last edited by
        #3

        @arminunruh Thank you!
        This is exactly what I needed.

        Big thanks for your help.

        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
        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