Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 

jQuery Icons Parser

This adds a basic syntax for icon frameworks:

[ui-flag]

Gets parsed as:

<span class="ui-icon ui-icon-flag" style="display: inline-block;"></span>

It will leave script and style tags alone:

[ui-flag]
<script data-icon="[ui-flag]">
    [ui-flag]
</script>
<style data-icon="[ui-flag]">
    [ui-flag]
</style>
<span class="ui-icon ui-icon-flag" style="display: inline-block;"></span>
<script data-icon="[ui-flag]">
    [ui-flag]
</script>
<style data-icon="[ui-flag]">
    [ui-flag]
</style>

Requirements and installation

jQuery 1.8 or later is required.

<script src="/jqueryui-icons-parser/jquery.icons.js"></script>

Icon frameworks

  • jQuery UI Icons [ui-{icon}]
  • Glyphicons [glyphicon-{icon}]
  • Font Awesome [fa-{icon}] [fa-{icon}-spin] [fa-{icon}-pulse]
  • Framework7 Icons [f7-{icon}]
  • Ionicons [ion-{icon}]
  • Typicons [typcn-{icon}]
  • Foundation Icons [fi-{icon}]
  • Metro UI Icons [mif-{icon}]
  • Elusive Icons [el-{icon}]

You can add custom icon frameworks like this:

// You can add a string - %icon% will be replaced with the name of the icon
$.icons.libraries.myicons = "<span class=\"myicons myicons-%icon%\"></span>";

// ... or you can add a function - the name of the icon will be passed as the first argument
$.icons.libraries.myicons = function(icon) {
	return "<span class=\"myicons myicons-" + icon + "\"></span>";
};

Usage

Simply call .icons():

$(".render-icons").icons();

About

Adds a basic syntax for icon frameworks.

Resources

License

Releases

No releases published

Packages

No packages published