Using window.print() or alternative on Android devices - javascript

On Android devices (I have tested Nexus 5, Nexus 10, Galaxy S4 and Galaxy Tab 3), the window.print() command in JavaScript doesn't do anything. As far as I can tell it doesn't even register an error.
I know for a fact that most if not all of these browsers can print because you can use mobile Chrome's menu to choose "print".
Why doesn't window.print() trigger the behavior you would expect (opening the clients print menu)? And is there an Android alternative to window.print()?

It is clearly stated in this Documentation, "The command is supported on iOS, Chrome on Windows and Safari and Chrome on Mac. It is not supported on Android."
Android phones don't have native support for printing yet, so window.print() will not work. Which means you need to use third-party app to do the printing. You could find some alternatives in this article.

I'm working on a simular problem and came up with this solution:
$(document).ready(function($) {
var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");
$('button.print').click(function(e) {
e.preventDefault();
if (isAndroid) {
// https://developers.google.com/cloud-print/docs/gadget
var gadget = new cloudprint.Gadget();
gadget.setPrintDocument("url", $('title').html(), window.location.href, "utf-8");
gadget.openPrintDialog();
} else {
window.print();
}
return false;
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button class="print">Print this page</button>
I haven't had the time to check if this works, i don't have an android device with me at the moment. I Would love to have some feedback on this ;-)

⚠️ [Deprecated] : Google Cloud Print will no longer be supported as of December 31, 2020. Please see the support article for help migrating.
Use Google Cloud Print (GCP) - there is no app required. The user must have set up a printer via GCP though.
This example uses GCP gadget
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Print</title>
</head>
<body>
<div>
<p>On android devices (I have tested Nexus 5, Nexus 10, Galaxy S4 and Galaxy Tab 3) the window.print() command in javascript doesn't do anything, as far as I can tell it doesn't even register an error.</p>
<p>I know for a fact that most if not all of these browsers can print because you can use mobile chromes menu to choose "print". My questions is, why doesn't window.print() trigger the behavior you would expect (opening the clients print menu).
And is there an android alternative to window.print()?</p>
</div>
<div id="gcpPrint"></div>
<script src="https://www.google.com/cloudprint/client/cpgadget.js">
</script>
<script>
var gadget = new cloudprint.Gadget();
gadget.setPrintButton(cloudprint.Gadget.createDefaultPrintButton("gcpPrint"));
gadget.setPrintDocument("text/html", "Print", document.documentElement.innerHTML);
</script>
</body>
</html>

I think, direct print() method is disabled on devices by default. I not saw so many phones or other Android devices with printer, however by USB it should be possible of course.
Instead, recommended is saving content/page as pdf and print it via some cloud print service.

At this moment, window.print() functionality works perfectly on my Android 5.0.1 device with both, Chrome and the default browser.

Now, window.print() is working on Android devices.

Download adobe acrobat in your phone and you can use windows.print() in mobile.

Related

problem with javascript and css in html page using windows xp chrome

problem in using code HTML, CSS, JS in chrome xp
hi i got this function that do brightnes on full page by clicking on button
<html id="html">
<button onclick="brightness()">lightting</button>
<script>
function brightness(){document.getElementById('html').style.filter =
"brightness(140%)";}
</script>
</html>
the code work in other chrome browsers (like chrome version 90) but in windows xp chrome its not what the problem (is it the javascript?)? what can i change so it will work?
MDN brightness says full support since v18
but
Chrome 49 is the last version to run on XP and according to can I use brightness you need -webkit
function brightness() {
document.getElementById('html').classList.toggle("bright");
}
.bright {
-webkit-filter: brightness(140%);
filter: brightness(140%);
}
<html id="html">
<button onclick="brightness()">lighting</button>
I'm not sure what version of Chrome you are running on your Windows XP, but according to caniuse, CSS-filters such as brightness were added in Chrome version 18, and have been supported since 2010.
If you're running an older version of chrome, that's why it doesn't work.

How to embed an inline PDF file in a web page that will be viewable on Android?

I'm looking for how to embed a PDF file in a web page that will be viewable in the native Android browser / Chrome. If I use something like this:
<object data={'LINK_TO_PDF.pdf'+'#zoom=100&scrollbar=0&toolbar=0&statusbar=0&messages=0&navpanes=0'}
type='application/pdf'
width='100%'
height='90%'>
<p>This browser does not support inline PDFs. Please download the PDF to view.</p>
</object>
It works great on Chrome, FireFox, and Edge on Windows. It works great in Safari on iPad (iPadOS) and Safari on iPhone (iOS).
But it does not display on Android.
The files are not publicly accessible, so I cannot use the Google Docs viewer.
PDF.js doesn't seem to help. PDFObject doesn't seem to help. I've looked a bit at ViewerJS.org, but most of its source code has not been updated in 7yrs.
I've seen lots of questions and answers about this, but most of them are old. Surely in 2021, there's a way to do this that works with Android?
(Having to download the file, open it up in a third-party PDF Viewer app, and then close it, switch apps, delete the PDF, and go back to the webpage seems very backwards.)
How can this be done to provide a good user experience on Android?

from chrome, i want to launch google in IE

I Want to: from chrome i want to launch google.com in IE.
Issue: when i run in chrome, google doesnt open. but if i am using IE, than google open up in IE
<Script>
function openURL(){
var shell = new ActiveXObject("WScript.Shell");
shell.run("iexplore http://google.com");
}
</Script>
<a onclick="openURL()" href=""> test </a>
The reason why this works in Internet Explorer (IE) and not Chrome is because ActiveXObject is not a web standard, and is only supported by IE. What you're asking for is unfortunately not possible at this time.
If this is just for you then you could create a custom protocol to open up internet explorer like you can do with the windows 10 calculator Calculator://
Then you would be able to launch it in plain html
Open Internet Explorer
Calculator example:
Open Calculator
https://support.shotgunsoftware.com/hc/en-us/articles/219031308-Launching-applications-using-custom-browser-protocols
You may also want to take a argument as a website to open somehow

Javascript sounds in Android and Iphone browser

I'm developing simple javascript game,
which should be embeded in Android and Iphone in-app browser.
I have problem with sounds. I tried this, works good on PC,
but not working on android and works strange with big delays on iphone.
init:
var hitSound = new Audio('hit.wav');
play:
hitSound.play();
How to play sounds without delay on Android and Iphone browser?
I think you're trying to use a HTML5 feature, which is not fully supported by Android's browser, at least up to FroYo. Still, if you use Android's WebView you can do the trick, but probably you are avoiding Native apps, aren't you?
This would help.
look for the page section where this is discussed:
The above two functions should be
placed in the HEAD section between a
<script language="JavaScript" type="text/javascript"> and a
.
The best place and time to invoke the
setEmbed function is in the BODY tag
after page load:
<body onload= "setEmbed('sample',
'http://www.yourdomain.com/music/')">

Keystroke working in IE not in Firefox

I am just trying a simple application, to make the browser fullscreen. this is working for Internet Explorer, but not for firefox.
Also I want to know, that can the same thing be done in Mac OC? do i have to make changes for Mac OS (using safari, firefox etc)
the code it below.
<html>
<head>
<script type="text/javascript">
function fullScreen()
{
var obj = new ActiveXObject("Wscript.shell");
obj.SendKeys("{F11}");
}
</script>
</head>
<body>
<form>
<input type="button" value="Click me!" onclick="fullScreen()" />
</form>
<p>By pressing the button above, a function will be called. The function will alert a message.</p>
</body>
</html>
Regards
Zeeshan
All modern browsers, including IE8, allow the user to disallow a script's opening, moving or resizing a window. Also, IE allows you to prohibit activeX from untrusted (internet) sites,
and the other browsers don't have native activeX. so your solution may have very few successes, and a lot of errors and security warnings.
Of course, users can press f-11 anytime- maybe you could suggest they do so.
I believe ActiveXObject is IE specific so it will never work on FF.

Categories

Resources