<a href="javascript:tran.setLang('default');">日本語</a>
<a href="javascript:tran.setLang('en');">English</a>
<a href="javascript:tran.setLang('cn');">中文</a>

<div class="txt">
  こんにちは、世界!
	<!--{cn}你好 世界!(任意のテキストを表示できます)-->
  <!--{en}Hello World(任意のテキストを表示できます)-->
</div>

<div>
  画像も言語ごとに変更可能!altやtitle属性も変更可能です<br>
	※上やこの注意書きは翻訳させない等も可能です<br>

	<img 
  alt="画像です" 
  alt-cn="图片" 
  alt-en="image" 

  title="画像なんだよ" 
  title-cn="图片!" 
  title-en="I's image." 

  src="https://picsum.photos/300/200" 
  data-lang-cn="https://picsum.photos/301/200" 
  data-lang-en="https://picsum.photos/302/200"
/>
</div>
.txt{color:red;font-weight:bold;}
div{margin:20px;}
var tran = new Translater();
  if (tran.getLang() === "default") tran.setLang('jp');

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://unpkg.com/translater.js/dist/translater.js