This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Danny White
Posted Jan 30 - Read on Facebook

Is it possible to have a browser's native back/forward buttons be interactive within a prototype? I'm working on a web project (so no on-screen back/forward buttons), where the chrome (most likely Safari iOS) will be visible when demoed internally


Jason Valalik

Is there a simple tutorial on this? I'm trying to build a web app and users have a tendency to use the browser buttons and I'd like them to work.

Danny White

Right now I'm using a (usually invisible) square fixed to the bottom left, that goes to the previous page. It's a hack though. And yep, I'm aware of etc

Jörg Lehmann

yes, you can use the history api, and change the url (1) while your prototype is changed, without reloading the whole page. then use the browser's native back button, and have your prototype react (2) to the changes.

(1) history.pushState
(2) window.addEventListener "popstate"

i hope google will provide you with some detailed examples ;)
best of luck!

Danny White

Thanks Jörg, much appreciated. Have almost figured it out through googling, but still stuck with (2). Is this placed within the same event as (1), or outside? Right now my states are being pushed to the history, but hitting the browser back button doesn't do anything (equal to the amount of 'dead' states I add

Jörg Lehmann

i'm pretty sure that (2) should be placed outside the event.. but i never used the history api in framer as well, so i'm curious, and working on a minimal demo as we speak… i'll post it here, if i succeed.

Jörg Lehmann

Danny White hope this helps:

Danny White

Legendary, thanks Jörg!! Appreciate the example file

Read the entire post on Facebook