i am trying to make a utility app lookalike using JQM and PG.
Any ideas on how to add the little "i" button on the bottom right of the screen and perform JQM's flip animation to another page?
nevermind, got it myseelf 20 mins after i posted. just a link with an "info" image positioned absolutely outside the standart JQM s who's transition is set to "flip".
Related
I've used Vuejs and Framework7 in my PWA. I want to open a remote PDF file in my PWA and also it's important to me that users be able to back to my PWA after opening PDF. I did this using :
window.open(pdf_url, "_blank");
And it works fine for iOS > 12 and after opening pdf file there is an "OK" button for closing pdf.
But for example in iOS 11.3 there is no button and user has to use home button to close PWA.
I tried to solve problem using iframe but I can show only first page of the pdf.
Is there any way to fix this issue?
You can resolve this issue by doing some tricks (for any device without back button):
if you use iframe, you can set height manualy with overflow scroll, and I think this will resolve issue (dependence of style or lib dependency, so that may be not work).
you can add back button to your navbar, or Toolbar to let user click on it to back to previous page. (I prefer this solution).
you can render pdf in popup nested of normal html page, and then you can customize popup component by handling back button, or handling close by dropback overlay.
I use second and third point in real project and its work fine...
This is sample close button code used in popup:
'<p>'+ i18nextHelper.i18next.t('Exit From PDF') +'</p>'
Note: You can also customize height page for pdf page only, and add normal button bellow it, or by add absolute positioning button above PDF, but I think if you use second or third point will be best.
Good luck.
I am having a problem with making my mobile app home screen look like the image below, I have tried using grids but everything aligns to the left.
Has anyone successfully used grids in jquery mobile as home screen with icons?
I created a quick example that should help you on how to create such a home screen.The reason everything aligns to the left in your trys might be because you added style="text-align: left" to your grids? Cant really tell without any code from your side. Here is the
Example
I have a Cordova (version 6.3.1) app. This issue only occurs on iOS version of the app (Android works fine). Every time i press on a text box to insert a text after doing some scrolling, it jumps straight back to the top. After some investigating, I found out that
DisallowOverscroll=true
in cordovas "config.xml" only works on the main screen of the app, not if I go and click on a "modal" "KompressionStromper" in the video (it does not work inside there), so how can I enable it inside there? So the behaviour is not like in video?
Please see video here on iOS 10.0.2 (during the first seconds i also try to pull at the main screen from top to bottom but there the "DisallowOverscroll" option works as expected).
Any other suggestions and help will be highly appreciated.
For the specific element you can disable overscroll with jQuery.
Like:
element.ontouchmove = (event) => {
event.preventDefault();
}
I strongly suggest that you also create a directive out of it, so it will be more done in a "angular way".
I'm using Appcelerator Titanium + iOS and I have a problem. I'm using webview without top / bottom shadow so it looks like it's not a webview, but this is not a problem - the problem is, I have some buttons
button
And I would like to add into CSS action on touch / on click. How can I do that ? I tried to use a:hover or a:active but it doesn't work correctly. I want to change background on touching / clicking buttons. Any help would be appreciated, thanks in advance!
Well, this isn't really an Appcelerator problem, as much as a simple html/javascript problem. Since your code is happening within a web view, it should have a standard html document structure. Have you tried something like this?
button
I would like to add a navigation bar at the top of "some" of my phonegap based ios application pages. I have tried using JQM based headers and they don't seem to be steady enough ( i.e. they scroll when I scroll the content and jump back). I would like to use a native control using a phonegap plugin ( like NativeControls) However I haven't been able to find anything ( as far as I can tell NativeControls used to have navbar control but it got discontinued) Any ideas? suggestions?
One of the options is to use a tool bar control on the top of the page but then it does not really have a way to create a title in the middle and buttons on left and right. Also it has no way of adding the native "back" control either.
I have been researching it for a while but haven't been able to find anything.
Update:
I ended up writing my own Navbar and hooking it to a javascript call through phonegap
Checkout this edited plugin for UINavigationbar
https://groups.google.com/forum/?fromgroups#!topic/phonegap/XVru2zgB_yc
I've had this problem too. Didn't find any plugins for this also.
This is what I did:
I've created a CSS NavBar/TopBar with position:fixed
Used this solution to make it work on iOS 4 too: Fix position:fixed in iOS 4