码迷,mamicode.com
首页 > Web开发 > 详细

使用jQuery集成Google翻译

时间:2014-07-02 23:40:07      阅读:375      评论:0      收藏:0      [点我收藏+]

标签:des   http   java   color   使用   width   

利用jQuery,轻松将google翻译集成到你的web应用中。

1. [代码][JavaScript]代码     
?
1<script src="Scripts/TranslatorScript.js" type="text/javascript"></script>
?
2 [代码]LoadScript,设置路径     
?
?1LoadScript(scriptPath + "jQuery-BlockUI.js");
2LoadScript(scriptPath + "jquery.translate-1.4.7.min.js");
3LoadScript(scriptPath + "jquery.cookie.js");       

?3. [代码][JavaScript]代码     
01function getScriptsPath() {
02    var scripts = document.getElementsByTagName("script");
03    var regex = /(.*\/)TranslatorScript/i;
04    for (var i = 0; i < scripts.length; i++) {
05        var currentScriptSrc = scripts[i].src;
06        if (currentScriptSrc.match(regex))
07            return currentScriptSrc.match(regex)[1];
08    }
09 
10    return null;
11}
4. 代码]loadTranslator   

01function loadTranslator() {
02 
03    $.translate(function() {
04 
05        try {
06            $(‘#translate-bar‘).html("");
07        }
08        catch (e) {
09        }
10 
11        var selectedLanguage = $.cookie(‘selectedLanguage‘); //get previously translated language
12 
13        if (selectedLanguage) {
14            if(selectedLanguage != ‘en‘)
15                translateTo(selectedLanguage);
16        }
17 
18        function translateTo(selectedLanguage) {
19            $(‘body‘).translate(‘english‘, selectedLanguage, {
20                not: ‘.jq-translate-ui‘,
21                fromOriginal: true,
22                start: function() {
23                    $(‘#jq-translate-ui‘).val(selectedLanguage);
24                    $.blockUI.defaults.applyPlatformOpacityRules = false;
25                    $.blockUI(
26                            {
27                                message: ‘Language Translation In Progress, Please Wait...‘,
28                                css:
29                                {
30                                    border: ‘none‘,
31                                    padding: ‘10px‘,
32                                    backgroundColor: ‘#000‘,
33                                    ‘-webkit-border-radius‘: ‘9px‘,
34                                    ‘-moz-border-radius‘: ‘9px‘,
35                                    opacity: .9,
36                                    color: ‘#fff‘
37                                },
38                                overlayCSS: { backgroundColor: ‘#000‘, opacity: 0.6, ‘-moz-opacity‘: ‘0.6‘, width: ‘100%‘, height: ‘100%‘ }
39                            });
40                },
41                complete: function() { $.unblockUI({ css: { cursor: ‘default‘} }); }
42            });
43        }
44    // Languages are loaded into the selection box 
45        $.translate.ui({css3特效
46            tags: ["select", "option"],
47            //a function that filters the languages:
48            filter: $.translate.isTranslatable, //this can be an array of languages/language codes too
49            //a function that returns the text to display based on the language code:
50            label: $.translate.toNativeLanguage ||http://www.huiyi8.com/css3/?
51                function(langCode, lang) { return $.translate.capitalize(lang); },
52            //whether to include the UNKNOWN:"" along with the languages:
53            includeUnknown: false
54            }).change(function() {
55            $.cookie(‘selectedLanguage‘, $(this).val(), { path: ‘/‘ });
56            translateTo($(this).val());
57            return true;
58        }).appendTo(‘#translate-bar‘);
59    });
60}

使用jQuery集成Google翻译,布布扣,bubuko.com

使用jQuery集成Google翻译

标签:des   http   java   color   使用   width   

原文地址:http://www.cnblogs.com/xkzy/p/3818772.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!