splash page animation - javascript

I have this idea in my head that when my site loads, there's this line of text or image that says... i don't know, "hello"... then, after about 2 seconds or so, it smoothly and quickly slides to the right with my home page following it stopping when the page is centered with the browser window. My entire site slides left or right horizontally when you change pages. would anyone know how to accomplish this? thank you so much!
heres the code i'm using for my navigation for my site.
http://www.queness.com/post/356/create-a-vertical-horizontal-and-diagonal-sliding-content-website-with-jquery

Related

footer animation with button

The issue I have having is a need to build a footer that only appear when you have scrolled to the bottom of the page. then once at the bottom the footer animates up. It is no problem if it over laps what is on the bottom. I also need a button in the top right corner so that the footer goes back down and disappears. My client wants what https://yorkcapital.com/ has... you sometimes have to scroll down and force it to comes up by trying to scroll down more. Ive never created a footer like this... Please help. I just never thought about using a footer this way. please please help. thanks everyone!

How to make a component appear below a fixed element when the page is fully scrolled

I'm a developer intern, and at the moment I'm designing a few web pages for my company. The latest request has me puzzled, so any help would be much appreciated. Using next.js
We have a page, with content, and at the bottom, a button. The button is fixed, so it's always visible. We have another component, a simple footer with links in it.
What I need to do is stick the footer below the button, but only when the page is fully scrolled down.
So: if the page is not fully scrolled down, only the button should be visible at the bottom. If it is fully scrolled down, the component with the footer should be visible below the button.
Any pointers/tutorials/links on how I could go about doing this?
Thank you!

Slide up window in HTML/JS

Im trying to add a button/tab on the bottom right corner of the page. That when clicked slides up a window. I've seen this somewhere but i can't get it to work.
I found my answer shortly after. If you're looking for the same, this thread might help:
HTML CSS/JS Bottom navbar Sliding Up

FullPage JS scrolling issue

The website is working as intended so apart from an annoying issue where it automatically scrolls everything back to the start of the second section.
Is there any way I can keep the scroll from the first video background section to the second section and have the second scroll like a normal website without the page scrolling to the top every time I scroll down?
The site can be seen here: http://lukedaly.ninja/gianttest/
This is the plugin I am using: https://github.com/alvarotrigo/fullPage.js
All help is very much appreciated! :)

Android native browser navigation bar

I'm working on a responsive website and want to make an overlay menu like on play.google.com.
My layer get's dynamicaly the height of the window to fill the screen from top to bottom and get's "position:fixed" to stay where it is.
I do "window.scroll(0,100)" to vanish the navigation bar. But when I try to scroll inside my menu by touch the whole page scrools up and shows the navition bar again. Then it's no longer possible to scroll the page. The result of this behavior is, that man menu is now to long and the bottom of the menu is no longer visible on the page.
On the google play website they used something that the navigation bar never vanishes and I think this could help to avoid my problem also, but I haven't found out how to do that, yet.
I hope someone of you has some experiance in that.
thanks in advance
Frank

Categories

Resources