November 4th, 2008
Airport – Information board text effect jQuery plugin
Airport is a rather simple text effect plugin for Jquery. It emulates the style of those flickering information boards you sometime find on airports and train stations.
Airport is a very, very, very simple text effect plugin for Jquery. It emulates the style of those flickering information boards you sometimes find on airports and train stations. Just watch the demo and you will understand
How to use Airport
Airtport is very easy to use. Create an element, give it an ID and throw airport on it. The values, moscow, berlin and stockholm, are the words it will flick through.
<div id="stuff"></div>
<script type="text/javascript">
$('#stuff').airport(['moscow','berlin','stockholm']);
</script>
| Version | Changes |
|---|---|
| 1.1 | Defaults to hyphen, if character not found in character array. |
Comments
Make a comment
Projects
- Accordion (jQuery)
- Airport (jQuery)
- Chat
- Defaultvalue (jQuery)
- Elastic (jQuery)
- Highlight (jQuery)
- Keycan
- Lazy (jQuery)
- Limit (jQuery)
- Password Strength (jQuery)
- Show Password (jQuery)
- Tabify (jQuery)
- Valid8 (jQuery)
Latest posts
- July 8th, 2009 Why are we typing passwords twice?
- July 5th, 2009 Don’t stop password masking; let the user decide
- June 1st, 2009 You can’t validate email addresses with regular expressions
- May 20th, 2009 Konami Code: Why so verbose, when you can make it in 140 characters?
- May 18th, 2009 Let your users know if Firebug slows down your web page.
Cool plugin!
I really like this, but i’ve found a minor issue;
If a character isn’t found in the predfined array, the script stops, and therefore doesn’t ’skip’ to the next character and carry on the transition.
Maybe some sort of option to enable/disable this behaviour would be good.
Yeah, it should probably be some kind of fail safe there. I’ve updated the plugin to version 1.1 making it pick the last character, which is a hyphen in version 1.1, if it can’t find one.
Very good! But real airport boards have fixed letter spacings, I mean in your demonstration you can see the words shake. Because “l” takes less space than “e” etc. How to fix the widths of each letter? Is there a CSS trick for that?Thanks.
One can argue that “real airports” won’t have these kind of board at all, anymore. But yes; there is a css trick, or several actually. You can set the font-family to monospace (#stuff span { font-family: monospace}) or you can set the width of the spans (#stuff span { width: 20px; float: left; display: block; text-align: center; } ).
Im really impressed by this plugin but being a new user to web design Im having major issues implementing this in to my iweb site. Could anyone help with coding this to html code so i can add it to my site? Is this possible? Many thanks.
I think a good start for you would be to take a look at the source code of the demo over at http://sandbox.unwrongest.com/jquery.airport/. Download all the files and copy the source right off.
Hi,
This is so nice plugin. I translated it to Turkish and i published on my site. Thank you.
wow, that’s a wonderful effect
Impressive plugin i must say. Downloaded. thanks mate.
[...] – Airport – Information Board Text Effect | [...]
[...] 官网：http://www.unwrongest.com/projects/airport/ [...]
[...] – Airport – Information Board Text Effect | [...]
[...] – Airport – Information Board Text Effect | [...]
[...] Airport – Information Board Text Effect | Demo Airport is a very simple writing effect plug-in unit, imitates the airport or the train station notice board demonstrated that the stand writing effect, the beat demonstrated [...]
Is there any particular reason you didn’t include numbers in the plugin by default? It was a really easy fix just include numbers before the ‘-’ in the array.
Hello Jan, i’m posting from Barcelona-Spain.
I want to put your plugin in my wordpress blog but i try all of things and possibilities but i can’t to do it working ok.
Can you help my with a FAQ or link about how to do this. I like very much this effect.
(some minutes later…)
At the end in the end I have been able to implement the code. Its easy, only i put this code in a post:
I like
//
………………..
But i’ve a serious problem… it doesn’t show accents, ñ (with spanish tilde, symbol ?, and other special characthers… in the words with which I replace your cities..
i try to change to utf-8 the htaccess file, and other possibilities but it’s impossible to me.
Somebody has any Idea????????
Thanks for your beauty plugin….
Could I also use dynamic content instead of the fixed Words passed to the function? Let’s say I have an XML file with some nodes like Artist and Title but this content changes regularly…If I want the text to change with this effect I need to pass the XML data to the airport function, would that be possible?
thx 4 your answer and keep up the good work!
[...] Airport – Information board text effect jQuery plugin | Unwrongest: [...]
[...] Airport – Information Board Text Effect | Demo [...]
[...] Um efeito muito bom para sites no ramo de aeronáutica. Vale a pena dar uma conferida! Link: http://www.unwrongest.com/projects/airport/ Demo: http://sandbox.unwrongest.com/jquery.airport/ Share/Save [...]
Buen sitio
[...] Links: Tutorial | Demo tweetmeme_url = ‘http://ajaxdump.com/?p=95′;tweetmeme_source = ‘ajaxdump’;tweetmeme_style = [...]
[...] Sorgente: http://www.unwrongest.com/projects/airport/ [...]
[...] Codice Sorgente: http://www.unwrongest.com/projects/airport/ [...]
süper bir eklenti olmuş. elleriniz dert görmesin… daha iyilerini bekliyoruz..
cool stuff,
thanks
When I actually serve my pages as application/xhtml+xml, this plugin fails to work (at least in Chrome). Works perfectly when served as text/html in both Chrome and IE, though.
Hi Jan , thanks for the awesome plugin. But I’ve one doubt. Can we flicker all those letters at once and stop repeating the flickering effect.
Is there a way to speed it up?
Cool work :) thanks
Veramente un bel plugin, complimenti!!