[JQuery]JGTranslation:基于GOOGLE AJAX API的jQuery

转载:http://www.evlook.com/?p=126

平常上网遇见不懂单词和句子的时候,都喜欢用翻译软件来翻译一下,一般都用有道和google。这几天看google API的时候发现他好像早就提供了翻译的方法,不过好像没什么人用 :( 那我来用,呵呵。

写了个JQuery的小插件,结合google ajax API,提供页面文字的即时翻译功能,只要你指定要使用即时翻译的模块ID并指定翻译语言(如果不指定就按照操作系统默认语言进行翻译。)就能简单调用,非常方便。

如果你的blog是中文但是很多国外访问者那你可以用了试试,如果你的是英文blog,但是很多用中文的用户访问,你也可以使用。总之都是为了大家提供便利,呵呵。

可以选择下面的两段文字看看效果

曲曲折折的荷塘上面,弥望的是田田的叶子。叶子出水很高,像亭亭的舞女的裙。层层的叶子中间,零星地点缀着些白花,有袅娜地开着的,有羞涩地打着朵儿的; 正如一粒粒的明珠,又如碧天里的星星,又如刚出浴的美人。微风过处,送来缕缕清香,仿佛远处高楼上渺茫的歌声似的。这时候叶子与花也有一丝的颤动,像闪电 一般,霎时传过荷塘的那边去了。叶子本是肩并肩密密地挨着,这便宛然有了一道凝碧的波痕。叶子底下是脉脉的流水,遮住了,不能见一些颜色;而叶子却更见风 致了
Now that I’ve lost everything to you,
you say you want to start something new,
and it’s breaking my heart you’re leaving,
baby I’m grieving.
But if you wanna leave take good care,
hope you have a lot of nice things to wear,
but then a lot of nice things turn bad out there.

一、你必须引用google提供的API

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("language", "1");
</script>

二、翻译控件用到的默认样式

.JGTranslationPopStyle{font : normal normal normal 12px Verdana, Arial, Helvetica, sans-serif;border:2px solid #C5D7EF;background:#fff;}
.JGTranslationPopStyle p{padding:3px;margin:0px;line-height:150%;}
.JGTranslationPopStyle div{text-align:right;background:#E5ECF9;}

三、调用方法

$(selector).JGTranslation(options)
//可选参数
//Language:string(default = "userLanguage")
//PopStyle: string(default = "JGTranslationPopStyle")
//Branding:boolean(default = true)

示例:

<div id="TS1">
曲曲折折的荷塘上面,弥望的是田田的叶子。叶子出水很高,像亭亭的舞女的裙。层层的叶子中间,零星地点缀着些白花,有袅娜地开着的,有羞涩地打着朵儿的;正如一粒粒的明珠,又如碧天里的星星,又如刚出浴的美人。微风过处,送来缕缕清香,仿佛远处高楼上渺茫的歌声似的。这时候叶子与花也有一丝的颤动,像闪电一般,霎时传过荷塘的那边去了。叶子本是肩并肩密密地挨着,这便宛然有了一道凝碧的波痕。叶子底下是脉脉的流水,遮住了,不能见一些颜色;而叶子却更见风致了
</div>
<div id="TS2">
Now that I've lost everything to you,
you say you want to start something new,
and it's breaking my heart you're leaving,
baby I'm grieving.
But if you wanna leave take good care,
hope you have a lot of nice things to wear,
but then a lot of nice things turn bad out there.
</div>
$('#TS1').JGTranslation({Language:'en'})
$('#TS2').JGTranslation()


点击下载jquery.JGTranslation.js

赞(0) 打赏
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏