I'm currently developing HTML 5 mobile web apps. If you add such an app to your homescreen on an iPhone, it pretty much looks like a native app since I am able to hide the mobile safari's address bar. This can be achieved by using some meta-tags within my HTML code.
Now I was wondering if hiding the address bar is also possible on the Blackberry OS 6? Does anyone have an idea if and how this could be achieved? Is there a Blackberry-specific meta-tag?
There is no meta tag available for BlackBerry.
Try to use the window.scrollTo (0,1) function while loading the content into the browser.
Related
I have deployed a personal flutter-web project on firebase and the responsiveness is working fine. As in when the website is opened on a laptop it shows a UI specific for large screens and when it's opened on the mobile phones (chrome browser) it shows UI for mobile screens.
Now the problem is, whenever I check "Desktop Site" in the chrome browser, I get the UI that is meant to be shown for larger screens which is okay, but it looks stretched vertically, and the appbar at the top is also not visible.
so my question is,
Is there a way that I could check whether browser's desktop-site mode is ON?
or any other way that I could just make the website look like a zoom-out version of web UI whenever desktop-site mode is ON?
We were not shown the code. Therefore, it is difficult to say for sure. But I had such problems when I ran the application building without parameter --web-renderer
flutter build web
The point was that by default it uses different renderers (CanvasKit for desktop and HTML for mobile). And since I used things that required CanvasKit, the application in mobile browsers was displayed incorrectly.
Building with the appropriate parameter solved my problem
flutter build web --web-renderer canvaskit
I've finished my web page with its style sheet, not sure how it didn't work on phone browser because it work on laptop browser.
It worked when I put it on free web host and then open it with phone browser, but when I put it in phone storage, none of the CSS applied
moved the CSS file (prev href='folder/style.css') to href='style.css'
also use vendor prefix (-moz-,-webkit-,-ms-)
simple solution of this problem,
first open file in laptop and inspect your website or page then use responsive button which look like mobile.
and your css isn't apply because some mobile phone features are not able to show website as like our laptop tablet or pc.
some have this type of feature like in MI mobile.
hope you understand...!
I am coding email template(Email marketing).
User can upload html template and select to send mail
I want resize html reponsive on my website like gmail?
How to Resize html element:img,text,table?
view on Gmail with Mobile
View On my website with Mobile
I was having the same issue and in order to fix this I found two approaches:
1) Activating the Request desktop version, under the mobile browser settings:
How to request desktop version of a Web site in Chrome for Android
How to Disable the Mobile Version of a Website on Your iPhone
2) But I just wanted to do this automatically, when my website load in Mobile browser without making the extra steps to set the Request desktop version, and this link provided me the instructions to fix the issue:
Responsive design with “switch to desktop site” option
I have some social sharing links to share a post. This has to be in a new popup/tab/window. You know, the box we all know to share something on FB etc.
For desktop a new tab isn' necessary, so I'm using this:
<a href="popup-example.html" target="popup-example" onClick="javascript:open('', 'popup-example', 'height=400,width=400,resizable=no')">
But now I was asking myself how to make it for mobile devices..
Maybe just a php script to detect if it's desktop, than use example above. If mobile, use <a target="_blank"?
Would this be the right way? Or do I need a mobile hook for the Facebook app for example?
How about trying:
javascript:open('http://domain.com', 'popup-example', 'height='+window.innerheight+',width='+window.innerwidth+'resizable=no')
This would open in a new browser window for desktop (popup) and a seperate tab for mobile?
You can not open a custom sized browser window on mobile devices. So you don't need a special solution to run your code in mobile devices.
I've got a html5 website/webapp. I only want people to view this website/webapp from their mobile phone i.e. iphone, android, blackberry.
If they try to visit the website/webapp from their desktop browser, It should display an error message as the website/webapp is only meant for the mobile phone.
Is this possbile? any tips?
Thanks
There's no way to check for sure wether a site is on mobile or desktop. HTML is made to be device agnostic.
you can do browsersniffing BUT
user_agents are easily changed in several browsers
you need to make sure to keep your user agent->mobile/desktop mapping up to date
you could do mediaqueries and conditionally display a query that way, but with the large array of formfactors available today there's no clear line to draw that way either.
Both methods will be prone to misidentification.
Quite Frankly, I'm kinda puzzled why you would want to prevent people from accessing your site. Why do you care if someone accesses your site from a desktop instead of a mobile device?
A site designed for mobile will work on a desktop just fine (it's the other way around that might be problematic)
Grab the script for the language you prefer from here:
http://detectmobilebrowsers.com/
Works for me.
You could use media queries, on the page and check the device width on which the page is width. Say if the page is viewed on Desktop, You can show a Message that this App is compatible with Mobiles Devices only and Not Desktops. similarly this should apply for tablets as well and this message can be customized.
Are you using any serer side technologies (ASP.NET, PHP) to generate the page? If so, you can perform your logic on the server side and return different content (like your message) on the desktop requests.
This is usually done by reading the user-agent. Are you ok with a desktop user over-riding their user agent to simulate a mobile browser and viewing the mobile content?