ansaurus

Question

jQuery translate + toggle, how to link the two?

Answer 1

+2 A:

This should get you started. There are some problems here, however, that you'll neeed to address. For example, this isn't necessarily going to translate all the text on the page, just the <p> elements inside <div id="article">. You can replace the selector with your own advanced selector that covers everything you need it to cover.

A couple of things I've changed from your original code:

You don't need an onclick event in the link–we can do what we need to easily inside the toggle function in jQuery.
The <div id="translation"> section is unnecessary (I assume you just copy and pasted from the API).
Make sure you access the link by its id, unless you need multiple links that translate the entire page (which doesn't seem to be the case).

<html>
<head>
<title>Google Translate Example</title>
    <script type="text/javascript" src="includes/js/jquery.js"></script>
    <script type="text/javascript" src="http://www.google.com/jsapi"&gt;&lt;/script&gt;
    <script type="text/javascript">
    google.load("language", "1");

    $(document).ready(function(){
     $('#link1').toggle(function(){
      $('#article p').each(function(){
       var element = $(this);
       google.language.translate($(this).text(), 'en', 'es', function(result){
        $(element).text(result.translation);
       });
      });
      $(this).html('English');
     }, function(){
      $('#article p').each(function(){
       var element = $(this);
       google.language.translate($(this).text(), 'es', 'en', function(result){
        $(element).text(result.translation);
       });
      });
      $(this).html('En Espanol');
     });
    });
    </script>
</head>
<body>
    <p><a id="link1" href="#container1">En Espanol</a></p>
    <div id="article">
     <p>Google Inc is set to introduce on Tuesday a new Web browser designed to handle text
    and graphics.</p>
    </div>
</body>
</html>

For more information, see the Google AJAX Language API.

Josh Leitzel 2009-08-20 22:25:50

Thank you very much joshleitzel.

2009-08-21 15:40:11

Answer 2

A:

What about http://www.google.hu/search?q=jquery+translate ?

tdg 2009-10-25 14:46:07

ansaurus

tags:

views:

answers:

jQuery translate + toggle, how to link the two?

related questions