8 Javascript Plugin Effects and Tools to Beautify and Control Web Text

Written by Kevin Liew on 21 Oct 2009
37,639 Views • Javascript
  • jQuery Font Effect | Demo

    Font effect is a jQuery plugin that add some effect to html text. The available effects are (for now) Outline, Shadow, Gradient and Mirror. No images are used for these effects and no additional CSS is necessary, All effects are contained in the plugin (only 7k minified) and do not interfere with page rendering in older browser or browser with javascript disabled.
  • Font Size Controller | Demo

    Font controller is a lightweight font size controller
  • Truncating Styled Text | Demo

    A handy plugin to truncate your paragraph and also, you can truncate your paragraph by using width.
  • Search and Share | Demo

    Search and Share makes highlighting text a more functional action. More specifically, it attempts to understand the intention of a user’s text selection and present a variety of options accordingly. The criteria for understanding the intention is the character length of the selection, and the interpreted actions are copying, searching and sharing.
  • typeface.js | Demo

    With typeface.js you can embed custom fonts in your web pages so you don't have to render text to images.
  • Label Effect | Demo

    A jQuery plugin that applies highlight and shadow effects to text in a control.
  • MooTool Drop Shadpw | Demo

    Text drop shadows can be used to improve headline legibility or simply for decorative purpose. In my latest project, I’ve had to use drop shadows just for the reasons above and ended up writing a Mootools class.
  • sFIR (Scalable Inman Flash Replacement) | Demo

    sIFR is meant to replace short passages of plain browser text with text rendered in your typeface of choice, regardless of whether or not your users have that font installed on their systems. It accomplishes this by using a combination of javascript, CSS, and Flash.
By Kevin Liew

Kevin Liew is a web designer and developer and keen on contributing to the web development industry. He loves frontend development and absolutely amazed by jQuery. Feel free to say hi to me, or follow @quenesswebblog on twitter.

Related Articles
10 Image Galleries jQuery Script with Thumbnail Filmstrip
11 Javascript Color Pickers Plugins
Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.

8 comments
Ben 15 years ago
Gradients are quite cool on jQuery. Very clever. Inspect it with Firebug.
Reply
Inside the Webb 15 years ago
Really, is there anything you can\'t do with JavaScript? It seems like as time has gone on with jQuery and other popular frameworks, JavaScript has become the best scripting language for page effects.
Reply
Kalvster 15 years ago
I\'ve seen these effects on many sites. I hope I can use these techniques sometime soon. :)
Reply
Rob 15 years ago
Typeface.js is great. Need to keep an eye on the font .js file size though,works well with clean simple fonts,
Reply
esranull 15 years ago
good tutorial
Reply
Waheed Akhtar 15 years ago
Excellent examples. Thanks for sharing
Reply
Mia 15 years ago
Great roundup K :)
There is also another great font plugin available for the WP platform as well as being able to generate it on just about every other platform as well ( if one doesnt want to implement @font face CSS3 ) ; this is a great plugin if one doesnt want to be bothered w/ code - and you can check it out here J. Its called <a href=\"http://www.fontburner.com/instructions/\" target=\"_new\">FONT BURNER</a> . One can either download the plugin if they have WP ; or they can simply copy the generated code ( after selecting the desired font ) if they dont have WP & paste it into their document . Its an awesome plugin . :D
Reply