This plugin is designed for quick development of a page that implements a Google Map with a list of the locations that are specified within the HTML.
The plugin tries to allow as much graceful degradation as possible by having the HTML be as semantic as possible. The plugin expect the HTML for the locations to be grouped under a common element. Additionally, it expects the links and Map Info Window content to be grouped under the location elements. It also expects the necessary metadata to be on the location element. This way the HTML semantically reflects that all of those parts and information are associated with the specific location or place.

Source

http://vigetlabs.github.com/jmapping/

Demo

http://vigetlabs.github.com/jmapping/examples/

The double-click functionality in the New York Times was somehow fascinating but also highly discussed because it boldly used the browser functionality to get the definitions of words. Fortunately, the double click now causes not an immediate popout to appear but lets the user confirm by showing an interrogation mark.

This inspired me to create a new jQuery plugin for translating text. Imagine, how users that don’t have English as their first language could profit from an integrated functionality to translate e.g. an article.

The plugin works with the Google Language API and can be used to translate a text in all the languages provided by the API.

You can call the plugin like this:

$(element).translate()

And you can configure the plugin in the following way:

1. original: the language shortage of the initial language (default is “en”)
2. notfound: the message shown when no translation was found
3. title: The title of the translation overlay
4. firstOptionText: the text shown as first option in the languages drop down

DemoDownload

The API of Google has a lot of useful usage examples. This showcase demonstrates how we can use the Google AJAX Language API to build a live translator that allows us to translate text from one language into the other – and that almost on the fly.

Check out the demo here: DEMO

Here is the jQuery part:

(function($) {
  $.fn.translate = function(options) {
		 var opts = $.extend({}, $.fn.translate.defaults, options);
		 return this.each(function() {
			$this = $(this);
			$("select#_from option[selected]").removeAttr("selected");
			$("select#_from option[value='en']").attr("selected", "selected");
			$("select#_to option[selected]").removeAttr("selected");
			$("select#_to option[value='es']").attr("selected", "selected");
			$('#content',$this).val("");

			$(document).keypress(function(e){
				if(e.which == 13){
					$.fn.translate.initialize();
					$("#content").val("");
				}
			});
			$('#_from',$this).change(function(e){
				$.fn.translate.defaults._from_lang = $(this).val();
			});
			$('#_to',$this).change(function(e){
				$.fn.translate.defaults._to_lang = $(this).val();
			});
		 });
  };
  $.fn.translate.initialize = function() {
	  var content = $('#content');
	  var text = $("#content").val();
	  google.language.translate(text, $.fn.translate.defaults._from_lang, $.fn.translate.defaults._to_lang, function(result) {
	    var translated = $("#translation");
		var translated_original = $("#translation_original");
	    if (result.translation) {
	      (translated.html() != "")?translated.append("
"+result.translation):translated.append(result.translation);
		  (translated_original.html() != "")?translated_original.append("
"+text):translated_original.append(text);
	    }
		else{
		  (translated.html() != "")?translated.append("
"+text):translated.append(text);
		  (translated_original.html() != "")?translated_original.append("
"+text):translated_original.append(text);
		}
	  });
  }
  $.fn.translate.defaults = {
    _from_lang	: 'en',
    _to_lang	: 'es'
  };
})(jQuery);

Note that this is just a demo. Not all the languages that are supported by the Google AJAX Language API are included here.

Enjoy!