Google translation icon doens't appear on a website I'm working on, and I can't find a reason for this. Should I add a specific code to enable chrome to suggest translating it?
Please note that I don't want to add Google Chrome widget, and Chrome settings are OK.
I'd like to make Chrome suggests to translate the pages of the website.
Here's an example: https://drive.google.com/file/d/1hKlPcs_HnIXApSa7jYX1pvDZigvdh9mc/view?usp=sharing
You can force the Chrome Translate dialog to show up by adding the lang tag with the language. This should work as long as the user doesn't have the settings in Chrome to never translate. Some people turn off that dialog in the chrome settings because they do not want to be annoyed by the translate dialog.
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Language
sample html.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>
<body>
<p>这只是一个测试。</p>
</body>
</html>
Can you try adding text in another language except english and then load the page ?
Related
I'm working on chrome Version 67.0.3396.99 and mac OS 10.13.5 (17F77). In my html, I don't want browser to convert an emoji to it's unicode text. I read this answer and it didn't help me much even if I added ︎. How can I do that?
First, I recommend to you, search for emojis in this page emojipedia, and then you only need copy and paste the emoji you want to use, make sure, you have
in your html head the <meta charset="UTF-8">:
<!DOCTYPE HTML>
<head>
<meta charset="utf-8">
</head>
<body>
😀
😋
<p>
Or just copy the emoji
</p>
😋
</body>
I am trying to use zebra datepicker library in my project. I have followed the instructions here and written the following codes:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="assets/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="assets/Zebra_Datepicker-master/public/javascript/zebra_datepicker.js"></script>
<link rel="stylesheet" href="assets/Zebra_Datepicker-master/public/css/metallic.css" type="text/css"></link>
<script type="text/javascript">
window.onload = function(){
$('#calendarValue').Zebra_DatePicker();
}
</script>
</head>
<body>
<div id="calendarContainer">
<input type="text" id="calendarValue"></input>
</div>
</body>
</html>
This results into a yellow icon attached to a text field with the id 'calendarValue', and the icon loads a calendar when gets clicked. I am getting the expected result in chrome, firefox and internet explorer 10 and 11.
While it is mentioned by the developer (Stefan Gabos) of zebra, that following strict doctype () makes it compatible with IE6+, and the example html's in zebra datepicker package also works fine to load the datepicker on IE9 particularly, my codes does not load the datepicker UI when I test it on IE 9; only the yellow icon gets attached to the text box and the calendar UI does not open when the button is clicked. It can be seen I did use doctype in my code so it should have been a problem to get the UI with old versions of IE, but that is not so in my case. Screenshots are given below:
I am a noob in web developing, and I cant figure out what is wrong here.
Hope everything is explained in detail this time.
Actually the problem was my company has policy to render intranet sites in compatibility view in IE which was causing troubles here. I used edge meta tag:
<meta http-equiv="X-UA-Compatible" content="IE=EDGE">
which is forcing my site to load in default standard mode in IE and fixed my issue.
Hope it would help noob people like me in the dark
In my HTA application I'm using a JavaScript calendar window, it opens using window.open() and closed using window.close(), when the user clicks on one of the dates. This calendar works fine on multiple browsers and versions over more than 10 years. It even works in HTA applications most of the time.
However on specific workstations running IE11. The window.close() command is simply ignored, resulting in the window left open. On other IE11 workstations it works fine. I figured that turning off the "Enable Protected Mode" checkbox on IE11, Internet Options, Security tab resolves the problem on one of the problematic workstation. However, other workstations works fine with this setting turned on and turning off this setting is not an acceptable solution.
Code sample which reproduces the problem:
HTA application
<HTML>
<HEAD>
<HTA:APPLICATION ID="OpenCloseExample" BORDER="thick" BORDERSTYLE="complex"/>
<TITLE>Open Close HTA container</TITLE>
</HEAD>
<iframe width="1024px" height="768px" src="http://localhost:28080/openclose.html"/>
</HTML>
openclose.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Main Page</title>
<script src="openclose.js"></script>
</head>
<body>
open
</body>
</html>
openclose.js
var win;
function openWindow() {
win = window.open("", "_blank", 'width=250,height=250,status=no,resizable=no,location=no,top=100,left=100');
win.document.writeln("<html><head><script src='openclose.js'></script></head><a href='#' onclick='javascript:window.opener.closeWindow()'>close</a></html>");
}
function closeWindow() {
win.window.close();
}
I can't see this working in any IE with any settings. The problem is this string: <script src='openclose.js'></script>. That is, a literal ending script tag in a string works as an ending script tag on a page, when HTML parser will find it. This means, that your script was never loaded.
To fix this, you've to break the literal tag, for example like so:
<script src='openclose.js'><\/script>
Since you have pointed out that IE11 is causing the JS not to work, you can force IE to render in an older version very easily.
<meta http-equiv="X-UA-Compatible" content="IE=9">
This meta tag is very popular amongst HTA applications for utilizing JS/ActiveX methods/properties within specific IE versions (most of them being deprecated).
For more information, visit the X-UA-Compatible Tag Wiki
Hope this helps
I figured this out eventually.
Changing:
open
to:
open
Has resolved the problem
I'm using ie10 and have had wrong values returned from modernizr from my site, it is an internal site.
It is running and to simplify things, I have it just checking the value of hsla.
There are a lot of other features that we want to see, but to debug I have stripped it down to just look at hsla.
If I go to different sample sites, "hsla" is shown as an option.
If I go to our site ex, http://www.example.com/test.htm, "no-hsla" is shown.
I have switched out the modernizr file we are using to use one from ajax.cdnjs.com and I get the same result.
I have generated a new download modernizr with just hsla in it and same result "no-hsla".
I can copy the same exact files to a server that I hit with IP http://x.x.x.x/test.htm and it works fine and show "hsla"
this is all I have in test.htm
<!doctype html>
<html lang="en" class="no-js" xmlns:og="http://opengraphprotocol.org/schema/">
<head>
<script type="text/javascript" src="moderntest.js"></script>
</body>
</html>
Any thoughts on this?
We can create application shortcut in google Chrome.
I would like to display a different layout when my web page is running in application shortcut mode - which basically is running in a separate standalone window.
Is there a way to tell if web page is running in application shortcut mode?
Right now I am testing if the window can be re-sized by JavaScript - assuming that it is running in application shortcut mode if the window can be re-sized.
I am wondering if there is a better way to do this.
[Update]
Basically we want to know if the webpage is running in a single window or running in one tab of a window.
I've just googled a bit and found this site: http://blog.kenneth.io/blog/2010/05/04/desktop-icons-in-google-chrome/
You can see this <meta> element in the first code block:
<meta name="application-url" content="http://www.example.com"/>
I haven't found any reliable and offcial documentation* yet, but it seems to work in a quick test I've just made.
In that way, you could pass an extra query string to your URI which only gets called when opening from a pinned (taskbar|desktop) short cut.
*) This <meta> element is also unofficially metioned here: Page Meta Properties - mozilla f1.
How can it be used?
Create a new HTML document:
<html>
<head>
<meta charset="utf-8" />
<meta name="application-url" content="http://www.exaple.com?shortcut=true" />
<title>Test</title>
</head>
<body>
Test
</body>
</html>
Now, open this document in Google chrome (works also with local file system!).
Create a taskbar and/or desktop shortcut via Chrome's Tools menu.
Chrome will open another window with the original URI. This is possibly a bug.
But if you use the shortcut, Chrome will open the URI provided in the <meta> tag (here: http://www.exaple.com?shortcut=true).