How is this site doing this scroll effect / full page effect?

JavaScript
1

http://atieva.com/about

The full page + scroll effect. I looked through the JS files and the HTML file for identifiers, but I’m having trouble pinning it down. Thanks in advance.

2

I can’t say what, but the bottom script looks familiar (the % tags)

<script type="text/template" id="partials/list-jobs-item">
    <% _.each(jobs, function(job) { %>

   <li class="list__item list-jobs__item">
        <a class="button list-jobs__item__link" href="<%= job.detailUrl %>" target="_blank"><%= job.title %></a>
        <span class="list-jobs__item__location"><%= job.location %></span>
    </li>

<% }); %>
</script>

<script type="text/template" id="partials/list-jobs-categories-item">
    <li class="list__item list-jobs-categories__item">
    <a class="button list-jobs-categories__item__link" data-category-name="" target="_blank">All (<%= totalJobs %>)</a>
</li>

<% _.each(categories, function(category) { %>

    <li class="list__item list-jobs-categories__item">
        <a class="button list-jobs-categories__item__link" data-measure="buttons:open-roles-category" data-category-name="<%= category.name %>" target="_blank"><%= category.name %> (<%= category.jobs %>)</a>
    </li>

<% }); %>
</script>
3

It’s annoying that their plugins in the JS file is minified. Makes reading through it hard.

4

A " unminify JavaScript" search returned numerous online tools, some sites prefer beautify.

5

Yeah, this is over 20k lines…I feel like it’s a greensock.com sort of plugin…TweenLite or something…or a variation maybe…I dunno.

6

the site, unfortunately, has no interest whatsoever in “Progressive enhancement”. :scream:

All I saw on my quick visit was #0e0e0e from top to bottom and left to right. :ng:

coothead

1 Like
7

Crikey, I’m amazed anyone is willing to wait the eternity it takes for that site to load. JS-driven sites for the loss …

1 Like
8

I basically have to make a slightly more crazy version of that page with a few changes. Fun stuff.

But it’s ok guys. I’m adding in a loading screen once the page is loaded to kill another second or two of the users time.

9

I’m using fullpage.js right now but the thing I really need is the dynamic transform movement that that site has, which I don’t see fullpage.js has. Has anyone worked with that plugin? Could really use some help on this.

10

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.