Numeric DL 2.0

Created Sunday 31st of August 2008 by Andreas Lagerkvist
Copyright © 2008 Andreas Lagerkvist (andreaslagerkvist.com)

Please have a look at the "Other Resources" for bug reports or further help on jQuery. Do not post bug reports or feature requests as comments to unrelated articles. If bug reporting on bugtracker.a-framework.org fails, e-mail me.

What it Does

This tiny plug-in numbers definitions in a definition-list if there are more than one definition for a term. Can be useful for FAQs, actual lists of definitions etc.

How to Use

jQuery('#glossary dl').numericDL();

Example

Jug
A small pitcher.
Vulgar Slang. A woman's breasts.
Bird
The animal of the skies

Example Code

HTML

<div id="jquery-numeric-dl-example">
<
dl>
    <
dt>Jug</dt>
    <
dd>A small pitcher.</dd>
    <
dd>Vulgar SlangA woman's breasts.</dd>
    <dt>Bird</dt>
    <dd>The animal of the skies</dd>
</dl>
</div>

JS

jQuery('#jquery-numeric-dl-example dl').numericDL();

Source Code

jQuery.fn.numericDL = function () {
    return 
this.each(function () {
        
jQuery('dt'this).each(function () {
            var 
numDDs    0;
            var 
dt        jQuery(this);
            var 
dd        dt.next('dd');
            var 
i        1;

            while (
dd.length) {
                
dd dd.next('dd');
                
numDDs++;
            }

            if (
numDDs 1) {
                
dd dt.next('dd');

                while (
dd.length) {
                    
dd.text('(' i++ + ') ' dd.text());
                    
dd dd.next('dd');
                }
            }
        });
    });
};

Download

Plug-in

Requires

Random jQuery Plug-ins

  • Favicons

    This little plug-in will insert favicons to all external links found on your site. The plug-in scans the URL the link is pointing to for a favicon and...

    Details

  • Text Shadow

    Frankly a rather crappy text-shadow plug-in (can one be done well? :) but nevertheless it does the job in some cases.

    Details

  • Code Block Toolbar

    If you post code-examples on your site you can use this plug-in to add some nifty buttons below each code-example that allows the user to, for example...

    Details

More Plug-ins

Recent Comments

  1. AL on "How to Create a Restaurant Menu in Wordpress 3 using Custom Post Types and Taxonomies"

    @kamera - I've also changed this part:

    <?p...

  2. AL on "How to Create a Restaurant Menu in Wordpress 3 using Custom Post Types and Taxonomies"

    @kamera - The last bit of code should be put in th...

  3. kamera on "How to Create a Restaurant Menu in Wordpress 3 using Custom Post Types and Taxonomies"

    Hi there,

    Very helpful tutorial.

    It all makes se...

Page cached. Loaded in: 0.4438 second(s).
Last DB change: 2012-02-07 02:59:50
Last file change: 2011-10-03 07:42:35
Cache created: 2012-02-08 03:50:27