From our sponsor: Chromatic - Visual testing for Storybook, Playwright & Cypress. Catch UI bugs before your users do.
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:
- original: the language shortage of the initial language (default is “en”)
- notfound: the message shown when no translation was found
- title: The title of the translation overlay
- firstOptionText: the text shown as first option in the languages drop down
Tiny break: 📬 Want to stay up to date with frontend and trends in web design? Subscribe and get our Collective newsletter twice a tweek.
Pingback: CSS and jQuery Tutorial: Overlay with Slide Out Box | Codrops
Pingback: Plugin jQuery : jTextTranslate, traduire facilement vos textes | DevZone - Zone de développement web
Pingback: jTextTranslate — Traduction de votre site en 87 langues » Javascript & Web Design - Tous les jours le meilleur des ressources Javascript pour intégrateurs web front-end (avec parfois un soupçon de PHP)
Pingback: CSS and jQuery Tutorial: Overlay with Slide Out Box | Excellence from web
is this prgm usable without having a website?
if yes how do we install it?
it does not work under php
esta buenisimo, el demo esta muy guapo gracias chato 🙂
Does it provide just a function to translate?
I am attempting to integrate a translation facility into the above website. I am using coldfusion and the text for translation will be presented in the form of tags. #recordset1.mytext#.
I am playing around with your demo page and it is working on my desktop server. But when I replace your text with the above, the text does appear but the translater says no translation available. This is the revised part of your code with the coldfusion tag
=========================
Paragraph 1
#recordset_test.pageone#
=======================
I suspect that the translation does not fire because
$(“#text1”).translate(); has not the ability to dynamically translate text1 into real text.
Is there a workaround ??
Many thanks for any assistance.
James kane
how can I change the default language to the arab ???
Excellent contribution, but I have a question, is it possible to limit the number of languages ??available for editing?, Ie can be configured to only be translated into English, French, Portuguese and Italian
Thank you very much
How can it work plz , explain
Is it possible to make it replace in it’s original space? I’m looking to do that and make it to translate a full page but exclude certain parts such as peoples names ect?