jqIsoText: jQuery Text Effect Plugin

Some content on our pages are more important than other and we want to made him eye catching. There are lot of techniques to achieve that.  One of them is jqIsoText.

jqisotext

With this plugin we’re changing size of letters in text. It starts from one font size and increment or decrement to other font size. On that way we’re getting something similar to isometric projection. That can be done for whole block of text or for every word in some text.

First download jQuery and jqIsoText and include on your page like this:

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jqIsoText.js" type="text/javascript"></script>

After that all you have to do is to select element on which you want to apply effect and call jqIsoText.

<script>
$(".elem").jqIsoText();
</script>

This plugin have only three options: fromSize, toSize and split. The first one is the size of first letter, second is the size for middle letter in text and third one is if you want to threat every word from text separately. E.g. if you want that your text in h1 tags starts from 50px, go to 20px and threat every word separately you should use next code snippet.

<script>
$(".elem").jqIsoText({ fromSize: 50, toSize: 20, split: 'yes' });
</script>

You sholud use this plugin for titles or some important line of text. Using this for long text may be difficult for reading and can cause opposite effect. Also, this can be used only for text nodes.

  • News Ticker in 4 lines of jQuery (93)
    There are a lot of different jQuery News Ticker plugins with lot of options that you can use. Do you want to learn how to create one on your own in only 4 lines of jQuery code […]
  • Twitter Flock for Wordpress: multiple accounts tweets with style (69)
    Twitter Flock is Wordpress plugin for showing multiple accounts tweets with different color scheme for every account. Also, there are setting allowing you to control how your tweets will […]
  • Just Random Color (0)
    Some time ago I was working on app where for each category we had to assign random color in case that user didn't choose one. A few day ago I needed to generate random color again. Instead […]
  • mooBarGraph: AJAX graph for MooTools (18)
    mooBarGraph is AJAX graph plugin for MooTools which support two types of graphs, simple bar and stacked bar graph. This plugin made graph from your JSON data and is compatible with all […]
  • Image gallery in 4 lines of code with MooTools and Dojo (8)
    Recently I wrote article how to create image gallery with description in 4 lines of jQuery code. Now, I will do the same thing with two other popular JavaScript frameworks, MooTools and […]

108 comments on "jqIsoText: jQuery Text Effect Plugin"

why the code:
$(“.elem”).jqIsoText({ fromSize: 50, toSize: 20, split: ‘yes’ });
testing in dreamweaver,but in localhost browser not working

william lau on November 9, 2014 at 12:07 pm

it not working in my browser.

nandy on July 10, 2013 at 1:05 am

Leave a Reply to 11个用于提高排版水平的jquery文字效果插件 | 编程·早晨 Cancel reply

Your email address will not be published. Required fields are marked *