README.md

lang-select

A utility to suggest page transition when a visitor is browsing the site written in not his/her first language. http://tajima.appleple.jp/sample/LangSelect/example/en/

Usage

<script src="js/lang-select.js"></script>

Write "div tag" and "javascript".

<div id="foge"></div>


<script>
    window.addEventListener('DOMContentLoaded', function(){
	new LangSelect("foo", [
        {"lang": "language code of ISO 639", "url": "http://example.com", "message": "message", "btn_message": "message on button"},
    ])});
</script>

If a visitor is browsing the site written in not his/her first language and LangSelect instance has "url" of his/her first language, "div tag" becomes as below.

<div class="active" id="foge">
  <div class="message">
	<p>message</p>
  </div>
  <div class="change-site">
	<button onclick="http://example.com">message on button</button>
  </div>
  <div class="reject-message">
	<button></button>
  </div>
</div>

Example

<div id="foge"></div>

<script>
    window.addEventListener('DOMContentLoaded', function(){
	new LangSelect("foo", [
        {"lang": "ja", "url": "../ja/index.html", "message": "日本向けサイトがあります", "btn_message": "クリック"},
    ])});
</script>

If a visitor is browsing the site written in not visitor's first language and he/she use Japanease, "div tag" becomes as below.

<div id="foge">
  <div class="message">
	<p>日本向けサイトがあります</p>
  </div>
  <div class="change-site">
	<button onclick="ユーザが入力した遷移先">クリック</button>
  </div>
  <div class="reject-message">
	<button></button>
  </div>
</div>