まだデータがありません。
クリック操作でWebサイトを翻訳「translate.js」
当ページのリンクには広告が含まれています。
スポンサーリンク
クリック操作でWebサイトを翻訳するプラグイン「translate.js」を紹介します。
jQueryプラグイン「translate.js」
このプラグインを使えば、クリック一発でWebサイトを簡単に翻訳することができます。
ただし！自動翻訳ではなく、手動翻訳です。例えば「こんにちは」という単語を英語翻訳する場合は「こんにちは=Hello」をあらかじめjavascriptで定義しておく必要があります。
翻訳プラグインというか、テキスト切り替えプラグインですね。
スポンサーリンク
デモの「翻訳」ボタンをクリックしてみてください。
デモのソース（HTML + jQuery）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="translate.jsのデモでーす。">
<title>translate.js - jQuery Plugin Demo</title>
</head>
<body>
<h1>translate.js のデモでーす。</h1>
<p class="trn" data-trn-key="hello">こんにちは</p>
<p class="trn" data-trn-key="thank">ありがとう</p>
<ul>
<li><a class="lang_selector trn" href="#" data-value="jp">日本語に翻訳</a></li>
<li><a class="lang_selector trn" href="#" data-value="en">英語に翻訳</a></li>
</ul>
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="jquery.translate.js"></script>
<script>
$(function() {
var t = {
hello: {
jp: "こんにちは",
en: "Hello"
},
thank: {
jp: "ありがとう",
en: "Thank you"
}
};
var _t = $('body').translate({lang: "en", t: t});
var str = _t.g("translate");
console.log(str);
$(".lang_selector").click(function(ev) {
var lang = $(this).attr("data-value");
_t.lang(lang);
console.log(lang);
ev.preventDefault();
});
});
</script>
</body>
</html>
スポンサーリンク