国旗のマークを押すと、対応する言語に翻訳されます。
コード
html
<div class="frame" style="text-align: center">
<a href="#googtrans(ja|en)" class="lang-select" data-lang="en">🇺🇸</a>
<a href="#googtrans(ja|zh-CN)" class="lang-select" data-lang="zh-CN">🇨🇳</a>
<a href="#googtrans(ja|es)" class="lang-select" data-lang="es">🇲🇽</a>
<a href="#googtrans(ja|fr)" class="lang-select" data-lang="fr">🇫🇷</a>
<a href="#googtrans(ja|ja)" class="lang-select" data-lang="ja">🇯🇵</a>
<h1 style="text-decoration: underline solid red; font-size: 3em;">こんにちは</h1>
</div>
js
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit" type="text/javascript" ></script>
<script src="https://iwasakishuto.github.io/js/jquery.js" type="text/javascript"></script>
<script>
$('.lang-select').click(function() {
var lang = $(this).attr('data-lang');
window.location = $(this).attr('href');
location.reload();
});
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'ja',
layout: google.translate.TranslateElement.FloatPosition.TOP_LEFT
}, 'google_translate_element');
}
</script>