Bootstrap tabs are greyed out when using browser back button - javascript

In my project I'm implemented solution for Bootstrap tabs to work with browser back button. I've do that using window popstate event. Everything works perfectly, but the tab you back out of stays grayed/selected. This is a CSS issue? or maybe this is handled by browser?

Related

Pop Up on mobile not working- wordpress

I am using the easy fancy box plugin on my wordpress site to create a pop up. The pop on the desktop/laptop works fine but on mobile it doesnt seem to pop up.
On my site, clicking on get quote button under the slider calls the pop up.
What is strange is another pop up called by clicking the subscribe button on the main menu works fine on both desktop/laptop and mobile.
I have tried deactivation all the pluings yet i can find a reason for this.
I suspect its something to do with a touch even on mobile?
Link to my site is http://goo.gl/Yjt0qX
I checked on Mobile size (push F12 with google chrome and select your device) and it's work

Bootstrap Modal disappearing in ipad

I am working on a website where I have used bootstrap modal. When I am testing my website in ipad modal gets opened but whenever i am trying to edit some thing within that pop-up modal, the modal pop-up disappearing but the modal backdrop is still there.
Can any one tell me why this is happening?
Thanks in advance.
different versions of iOS have sometimes undesirable behaviour when focussing on an input - natively it tries to center the input while bringing up the keyboard and seriously messes with the DOM if you have fixed or absolutely positioned elements being affected, if this is your problem then you could try cancelling the auto-focus behaviour - see this answer Twitter Bootstrap modal on mobile devices for possible solutions.

Process Javascript in inactive tab on iPad

I have this solution that takes the user through a series of questions. At the end the user can click a button that opens a new window with a form to enter contact info. The population of this popup window is done through JavaScript from the calling window.
The process (in JS) is this:
Open popup window with loading gif
Store additional information remotely through ajax
Populate popup window with contact form
This all works fine in desktop browsers but not on iPads (using Safari where all windows are displayed as tabs). I have a suspicion that the JavaScript in the parent tab is halted when the "popup" tab gets displayed. To support this theory I can actually get the popup tab populated if I switch back to the parent tab immediately after the popup tab is displayed.
Can anyone confirm this? And of course if there's a solution I would very much like to hear about it.
Needless to say it works like a charm on my Android tablet :-)
Try using window focus and blur to activate some javascript when the focus is back on your tab.
See: https://stackoverflow.com/a/3479936/1712686

Bootstrap's dropdowns close in less than a sec after pressing them (Android 4.2.1, stock browser)

There's a problem with Twitter Bootstrap's dropdown menus on mobile. If I use Android's stock browser and click on a menu, it will open and close in less than a sec without me doing anything else. The same thing happens if I press the dropdowns on the official Bootstrap site, so this has nothing to do with my code.
If you want to keep the dropdowns open and fix this, you have to tap them for a little bit longer, smth like 1 second. But obviously I'd like a simple tap to be enough.
Is this normal for Android's stock browser? In Firefox and Opera Mini dropdowns work just fine.
Thanks!
PS: no, I don't have any form inside dropdowns. Only links that work fine in other browsers.
This is an android browser thing. They handle links with dropdowns as both a hover and click. Other browser such as iOS handles menus with dropdowns as just the hover then another click to initiate the link.

Mobile browsers: update element on back button

I'm using JavaScript to display a CSS3 throbber when the user navigates on a mobile browser (specifically, when they use a swipe gesture to navigate pages). However, when the browser back button is used, the throbber persists in both iOS and Android. I've tried adding the following to the body onload, but it doesn't seem to be firing.
<body onload='document.getElementById("throbber").class="off";'>
Any suggestions?
You need to listen to the Back/Forward Cache (bfcache) events: pageshow and/or pagehide. See https://developer.mozilla.org/En/Working_with_BFCache

Categories

Resources