Trigger link block with scroll?

Design help Animations & Interactions
1

Hey guys, quick question. So, I know you usually have to click a link block (or whatever is inside) to change pages but I was wondering if it was possible to scroll down to a link block and it trigger a page change without clicking. I have animations so that the change would look natural, but I’m just wondering if it is possible.

2

@aceon

Can you clarify what you are asking here? Also post some screenshots.

3

Screenshots wouldn’t help but I can try and explain better. Imagine there’s a red line halfway down the page (you would have to scroll to see it). What I want to know is, is it possible to redirect the user to a different URL once they scroll and the bottom of their viewport touches the red line.

4
  1. Each ‘Section’ where the redline is should be anchor link named accordingly.

for example:

  • Hero
  • Features
  • Testimonials
  • Form
  • Footer
  1. You need a script that will trigger URL change event on scroll in view in the section.

The script would contain something similar to:

   <li><a href="#" class="scroll-link" data-id="hero">Hero</a></li>
                <li><a href="#" class="scroll-link" data-id="features">Features</a></li>
                <li><a href="#" class="scroll-link" data-id="testimonial">Testimonials</a></li>
                <li><a href="#" class="scroll-link" data-id="form">Form</a></li>
                <li><a href='@Url.Action("FutureEvents", "Events", new { pageNo = 1 })'>{{page}}</a></li>

Talk to your developer about writing some lines of code that triggers URL change event on scroll event against Anchor tags.

2 Likes