Alright I have no idea how to phrase, and I'm new to StackExchange so I hope this is in the right place.
Anyway, I'm working on a mobile HTML5 app right now, one that uses Phonegap/Cordova (and Bootstrap), and I wanted to have an animation whenever a user clicks on a link.
So when a user clicks the link, there will be a page transition to the left, and the linked page pops up.
How could I do this in CSS/JS?
Welcome to Stack Overflow,
To design an HTML5 mobile app, i will strongly recommand using a front framework, like jquery mobile, ionic or onsenui.
Here is how you can simply do the swipe transition with jquery mobile : http://www.w3schools.com/jquerymobile/tryit.asp?filename=tryjqmob_trans_slide
Hope this help
Related
Is there a way to let PWA users know that a clicked link is being loaded. Usually in the browser we see the blue progress line indicating this but in the pwa the user is left to assume the page is loading except there is a pseudo effect on the buttons programmed by the developer. I understand the idea behind pwa includes giving users immersive visuals and if pages load faster, the users will not bother about the blue line but sometimes it's needed.
Going through the same thing but i think i found a way.
We can use bootstrap spinners to animate this. We can use javascript to detect a link click and show the spinner. We can also add this on submit button click.
I have recently deployed a website online using bootstrap as the front-end framework. I included the jQuery button to have the menu dropdown on clicking on it. During tests using my Chrome browser emulator, the navigation seems to work well, with it dropping down over the rest of the website content. However, on checking the same site using my iPhone 4s, the nav shows briefly for a split second and then disappears. I have fought tooth and nail with the CSS, but I can't seem to crack it. Any help would be greatly appreciated.
The web address is www.dof.com.ng
Thanks in advance.
Not sure if it's an appropriate question, but I will still ask..
Any advice on how WIX (the simple website builder) sites do the page transitions? such as transiting into a page with a Left to Right swipe in and loading the page on demand?
I have tried searching for tutorials but I am not too sure what to look for exactly.
Are these CSS and a combination of jquery?
Any advice would be appreciated.
An example site of the said transition:
http://www.alllinkmedical.com/
Thank You.
EDIT I mean to ask: where do I start looking at to create such page transitions on sites built from scratch
http://www.wix.com/support/main/html5/wix-editor/pages#Changing+Your+Page+Transitions
Taken from Wix website:
Changing Your Page Transitions
You can choose a page transition for your pages. The page transition determines how your pages will shift and what your visitors will see when they navigate from page to page.
To change your page transitions:
From the left side of the Editor, click the page icon to open Pages.
Under Page Transitions, click the drop-down menu and select a transition.
Now if you want a custom transition, I'd recommending looking at jQuery
I know smart app banners is not a part of the document,so "window.scrollTo(0,1)" will got it hide too.
Is there any nice way to deal with this?
I had the same problem and eventually tracked down a solution in the HTML5 Boilerplate mobile code. The details area in my question, Hiding address bar without hiding the smart app banner on iOS 6.
I'm looking to do a mobile web app in Wordpress. I need the template to have a thin (~3/4 inch) horizontal rectangular section at the very top that can be swiped to the left/right to serve as the navigation. Basically, every time you swipe this section to the right/left, it changes the page below it. I've seen templates where the whole page swipes, but not split in this was as I described it here. If anyone has any pointers for me on how to customize the template like this, I'd really appreciate it.
Try this plugin. They support Swipe left, right, up, down and double tap. you can specify the area where you want wordpress to register the gestures, say in your case it would be the ID of the Div you want user to swipe in. Let me know if you face any difficulty.