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. scroll to section from other page with fullscreen slider addon

scroll to section from other page with fullscreen slider addon

Scheduled Pinned Locked Moved General Discussion
2 Posts 2 Posters 529 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.
  • F Offline
    F Offline
    FesT
    wrote on last edited by
    #1

    Hi Armin,

    I am using the fullscreen slider and navigate through with the scroll to script, which works well.

    <script>
    jQuery(document).on('click', '.scrollto', function(e){
    e.preventDefault();
    e.stopPropagation();
    var sectionToScrollTo = jQuery(this).attr('data-scrollto');
    jQuery.fn.fullpage.moveTo(sectionToScrollTo);
    });
    </script>

    But I am struggling, with the implementation to the menu.
    Is it some how possible to jump from one page through the menu to a specific page on the fullscreen slider?

    best
    Felix

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

      Hey Felix!

      I think the menu is more for having links to other urls/pages.

      Maybe you rather want to do this with "lay options" -> "Custom CSS & HTML" -> "Custom HTML at top".

      In the custom html at top you could put some html markup like for example:

      <div class="fullscreenslider-links">
      <div class="_Default" data-scrollto="1">Scroll to 1</div>
      <div class="_Default" data-scrollto="2">Scroll to 2</div>
      <div class="_Default" data-scrollto="3">Scroll to 3</div>
      </div>
      

      Of course you will need to style this a bit with css, for example:

      .fullscreenslider-links{
      position: fixed;
      top: 10px;
      right: 10px;
      z-index: 10;
      }
      
      .fullscreenslider-links div{
      cursor: pointer;
      margin-right: 10px;
      display: inline-block;
      }
      
      .fullscreenslider-links div:last-child{
      margin-right: 0;
      }
      

      And if you only want this menu on one page and not on others you might want to hide it on other pages using custom css based on page http://laytheme.com/documentation.html#css-based-on-current-page

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