We are trying to implement a lightbox based album viewer in our web application. However, we are struggling to get it working for IE. Can you please suggest the remedy? It would be great if you can suggest some other alternatives for implementing the picture slide show for album too.
FancyBox is a jQuery plugin similar to lightbox. Works with IE and supports different media in the dialog (e.g. videos, ajax calls)
Slimbox claims to have IE6 compatibility. I don't have access to an IE6 machine to test today but it might be worth checking out their demo page.
The beauty of scripts like lightbox is that you can write the page to work on really old browsers, then the script just makes it work much better. Your page should already work before you add the lightbox script (i.e. the thumbs should already link to the full size image, or open it in a new window).
I would suggest lightbox2 and then there is jQuery Popeye what is IMHO by far better. Check out a demo installation here.
Related
I use Brackets editor to develop, I can check website on Chrome in desktop with :
http://127.0.0.1:49371/index.html
But it won't load on my iPhone (same wifi)
(I know I can play with the window on chrome, I need actual mobile device)
Couldn't find a way to do this.
ngrok is good for this, it allows you to publicly share local urls https://ngrok.com/
This is really hard to do. One solution that is easy, however, is to code on codepen.io and view your projects in debug view on mobile.
I have a webapp which is running perfectly well in most browsers, but I'm still trying to work out a few bugs which is preventing it from working correctly in iOS Facebook's in-app browser. Until I've got these sorted, I'd like to provide a message to give users the option to open the link in Safari.
The solution I have for now is to use javascript to detect the browser's user agent (similar to this question), and if it's the Facebook in-app browser, provide a message that the webapp is optimised for Safari and give instructions to copy and paste the link into Safari.
My question is this: is there a way to make a <a> tag open in a particular browser? I have seen questions like this one which seem to point to using target="_system" for Cordova apps, but is there a method to do this with html only?
There isn't a way to do this for Safari (using just HTML, anyway). For other browsers that have custom URL schemes, you could do it. For example, for Chrome you could have your link point to googlechrome://www.website.com.
The definitive answer: No, this is not possible.
As Andrew M mentioned, some browsers have some methods that do some things similar, but a pure html method to open a link in a generic browser does not exist.
I am trying to open a pdf from my JQM webapp. I have tried iframes/embed/object, and none of those work on an iphone like they do on a desktop browser (scrolling, zooming, etc). I have settled with simply opening the pdf via a link Link. This works fine in the standard browser because the user can simply use the browser back button to navigate back to my app.
The issue that I am having, is that when a user saves the page to thier home screen and opens it using the chromeless safari browser, they no longer have the browser back button. I have tried adding target="_blank" to the link, but apparently JQM hijacks the link and prevents opening in a new page, and I have been unable to get the hacks to work.
I have also tried pdf.js, but I can't seem to even get that to work as my javascript knowledge is fairly limited, and the examples are pretty advanced. The only tutorial that I found used an old version which I couldn't get to work.
Are there any ways to bypass the JQM in openning a link in a new window (which would in turn open in the mobile safari rather than my chromeless web app), or are there any other suggestions for how to open a pdf from a webapp?
Just disable the default jQuery Mobile behaviour, by specifying data-ajax=false.
For example:
Link
See http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html
For my webApps I used https://docs.google.com/viewer to embed the pdf into my interface.
So, when I navigate the webApp by home screen icon, the app doesn't close when I open the pdf.
I met the same question: open pdf in webapp with html5.
I've tried several solutions: iframe、embed、pdf.js, but none of them is the best solution.
tips: iOS 9.x upper, open pdf with iframe only show the first page of the pdf file, and there will be a <img /> tag in the iframe body when you debug.
util now I still have this troublesome problem, anyone has solution please write your experience here.
Thank you.
I'm coding a web app that uses a picture that the user can upload from their phones/computers and I found out that ios 5 doesn't allow you to upload anything (see A html5 web app for mobile safari to upload images from the Photos.app?).
Since it seems pretty much impossible I want to show a message to those users asking them to upgrade or pointing them to alternative solutions described in the link above (piccup and the like) if they want to use my app.
Can I direct this message just to ios 5 users via a media query or something similar?
Are you looking for a server side solution (Like PHP for example) or client side (JavaScript)?:
Here is a JavaScript solution:
<script type="text/javascript">
if (navigator.userAgent.match(/OS 5(_\d)+ like Mac OS X/i))
// this helps detect minor versions such as 5_0_1
document.write("You have iOS 5! Aren't you special!");
</script>
Source: https://stackoverflow.com/a/13087526/1800369
For PHP you can track this:
Detect iOS version with PHP
As you mention media queries I guess you want to do this in your CSS. Perhaps detecting the screen width of 1136px (according to orientation) would do the trick for you?
More here
You should check with jQuery for file input support. Please check an answer to this question on how to do this. Note that author stated that this snippet will return true on some Android devices even if they don't support input elements, but since you asked specifically about an iPhone I think it should do the job.
This seems like it should be simple but after a couple hours of googling I have not figured it out. I know I can add iCal links using ICS files, but this does not work on the iPhone.
BTW, when I say iPhone I would like it to work on the touch also. Anyone have any luck with this?
You can get iPhone to download the .ics file (using Safari on a mobile web page) by using the webcal protocol:
webcal://website.mobi/mymeeting.ics
As of iOS 5, if you create a simple http link to an .ics file, Mobile Safari will offer to open it up in Calendar.
According to the iPhone documentation there is no URL scheme for the Calendar application. (There are URL schemes for Mail, Phone, Map, YouTube and iTunes.)
Of course there could be something undocumented, but I'm not sure that using it would be a good idea even if you can find it.
Of course it is possible but only if your JavaScript application is installed on the device. Look at http://tetontech.wordpress.com to see how to make calls from JavaScript to Objective-C. You can then use this and the Calendar Store Programming Guide from the documentation in Xcode to do what you want.
It is not possible. Apple does not want you to do this.
Now, what you could do is bookmark a javascript bookmarklet that checks the user-agent of the browser invoking it, and if the user is on Safari on their laptop or desktop Mac, then invoke the iCal using standard method (ICS file).
The user on iPhone could bookmark your page into a home screen bookmark with a useful (and perhaps custom) icon that said "Event" and title of "Meet Mary at 8:15". They could then, when they have synced their bookmarks, be reminded of the event and invoke it on their desktop browser.
Significant barriers here to educating users how to use this system, but it would work if you could convince people to do it, I think.