Page switching
I'm switching pages by switching between
display:none and display:block.
How can i stay on the active page even if I refresh?
Can I know what is the best practice for production, please?
https://codepen.io/ahad4387/pen/rNvEPoG11 Replies
You say page but you're making tabs. Honestly if you want pages use the native api and make multiple pages.
sorry about that.
Is it good practice to use pages or tabs?
Pages
Pages for pages 😎
like,nav bar is repeated in every page.
so I was like, it would be great if all content is loaded at once and i have to shift the tabs only
i'm building photo gallery so, loading will take time if i choose pages
Then you can check the url for state too and use the active class, though I recommend using aria-current
Ben Myers
Style with Stateful, Semantic Selectors
See how building with accessible semantics from the get-go can give you expressive, meaningful style hooks for free.
sorry didn't get you, I'm at start of JS actually
Have you ever built a normal non JS multiple pages site?
If not, do. simply cause it's how the web works.
URL - Web APIs | MDN
The URL interface is used to parse, construct, normalize, and encode URLs. It works by providing properties which allow you to easily read and modify the components of a URL.
Yeah, I was building only single-page landing pages till now with only HTML and CSS
okay, that's what I needed to understand.
thank you mate
If you really want to go with tabs (though as @b1mind has mentioned pages would probably be better) you could try setting a cookie with the "page" id. Then , if the page is refreshed, you check to see if the cookie has been set and then showing the desired contents.
However this will probably cause the contents in "page" 1 to flash before the JS code kicks in unless hide all the tab contents until you have checked the cookie (defaulting to "page" 1 of not set).
However this will probably cause the contents in "page" 1 to flash before the JS code kicks in unless hide all the tab contents until you have checked the cookie (defaulting to "page" 1 of not set).