Antti Kupila

Personal Blog, Portfolio and Online playground

View over the green room at Sid Lee, Montreal

FeedLanguage: translate rss on the fly

Yesterday Google released an addition I’ve been waiting for to their already impressive set of API’s, now including the Google Translate AJAX API.

Hello. My name is Antti and I am an RSS addict.
Seriously though, I get most of my industry news via feeds. The technology while being so simple really is extremely powerful, easy, quick and effortless; it’s hard to say no. Still, there are a couple foreign feeds i want to follow but i don’t want to translate the texts all the time, so i was looking for a service that translates RSS feeds on the fly. I didn’t find anything useful. FeedBurner does a lot so i could easily see them doing this too (especially now that they are a part of Google…) but nada. So, I built my own little prototype.

FeedLanguage beta | Feeds in your own language!

This was mostly built for myself but i thought i might as well release it for the public. Feel free to try it out and let me know if you run into issues. If you’re interested I don’t mind releasing the source.

How about my feed in .. Italian? ;)

Cool & accessible javascript link effect

Some time ago Niclas Bergström asked me for some tips on a javascript link effect, similar to effects we’ve seen in flash since day one. The link would kind of switch when you hover it. The idea is fully by Niclas, so I’ll give all the cred for it to him.

A challange here and there is always nice, so I thought I’d take it on me. Javascript really isn’t my thing, but I think the result turned out pretty nice.

Click here to view the example

I had three main priorities when writing this

  • Easy to use & implement
  • Accessible & search engine friendly
  • Semantically correct markup

I think i managed pretty well. Give it a try!

Here’s how it works:
Just add class=”switch” to your existing links and include linkswitcher.js in your document. Style your links with css. The switched link will use a class called switchHover. View the source of the example css for further info. That’s it!

Notice that you can’t apply a margin or padding to the a element itself. Apply it to the parent element (in the example the li, see example 3)

The work is licensed under CreativeCommons Attribution-ShareAlike 2.5 license, which means that if you make modifications, you will have to share it under the same license. If you share it, I also want to be noted as the original author, with a link back to this site.
The usage for any purpose, however, is totally up to you.

Download source files