
# v1.x 版本使用说明
* 当前为 v1.x版本的文档说明
* 如果要查看 v2.x版本的说明，请查阅： [README.md](README.md)

## 体验-在网页上几秒增加多语言切换能力：
![效果](http://cdn.weiunity.com/site/341/news/9a7228aaae28475996da9026b93356c8.gif "")

1. 随便打开一个网页
2. 右键 - 审查元素
3. 粘贴入以下代码：	  
	```` var head= document.getElementsByTagName('head')[0];  var script= document.createElement('script');  script.type= 'text/javascript';  script.src= 'https://res.zvo.cn/translate/inspector.js';  head.appendChild(script);  ````
4. Enter 回车键 ， 执行
5. 在当前网页的左上角，就出现了一个大大的切换语言，切换试试看。

## 在线体验
http://res.zvo.cn/translate/demo_v1.html

## 快速使用体验
在网页最末尾， ````</html>```` 之前，加入以下代码，一般在页面的最底部就出现了选择语言的 select 切换标签。 其实就这么简单：

````
<script src="//res.zvo.cn/translate/translate.js"></script>
<script> translate.execute();//进行翻译 </script>
````

## 更多扩展用法

#### 指定切换语言的select选择框的位置
你想在你页面什么地方显示，就吧下面这个放到哪即可。
````
<div id="translate"></div>
````

主要是这个 id="translate" 切换语言的按钮会自动赋予这个id里面。当然你也不一定时非要是div的，也可以这样

````
<span id="translate"></span>
````

#### CSS美化切换语言按钮
可使用css来控制切换语言选择的显示位置及美观。如：

````
<style>
.translateSelectLanguage{
	position: absolute;
	top:100px;
	right:100px;
}
</style>
````
这就是控制切换语言的 ``<select>`` 标签

#### 设定 select 切换语言，支持哪些语言可切换

````
<script>
	translate.selectLanguageTag.languages = 'zh-CN,zh-TW,en';  //注意要放到 translate.execute(); 上面
	translate.execute();
</script>
````


默认不设置此，则支持 简体中文、繁体中文、英语 三种。
可设置的语言包括：

````
de,hi,lt,hr,lv,ht,hu,zh-CN,hy,uk,mg,id,ur,mk,ml,mn,af,mr,uz,ms,el,mt,is,it,my,es,et,eu,ar,pt-PT,ja,ne,az,fa,ro,nl,en-GB,no,be,fi,ru,bg,fr,bs,sd,se,si,sk,sl,ga,sn,so,gd,ca,sq,sr,kk,st,km,kn,sv,ko,sw,gl,zh-TW,pt-BR,co,ta,gu,ky,cs,pa,te,tg,th,la,cy,pl,da,tr
````

#### 设定是否自动出现 select 切换语言

````
<script>
	/*
	 * 是否显示 select选择语言的选择框，true显示； false不显示。默认为true
	 * 注意,这行要放到 translate.execute(); 上面
	 */
	translate.selectLanguageTag.show = false;
	translate.execute();
</script>
````

使用场景是，如果使用了:  

````
<a href="javascript:translate.changeLanguage('en');">切换为英语</a>
````

这种切换方式，那么 select下拉选择的就用不到了，就可以用此方式来不显示。  
当然你也可以使用css的方式来控制其不显示。比如：   

````
<style>
#translate{
	display:none;
}
</style>
````


#### 手动执行页面翻译


````
<script>
	translate.execute();
</script>
````
对于一些网页需要通过ajax请求来加载数据的情况，当加载完数据时，手动执行此方法，使刚加载的信息也进行翻译

#### js主动切换语言
比如点击某个链接显示英文界面

````
<a href="javascript:translate.changeLanguage('en');">切换为英语</a>
````