Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
118 lines (99 sloc) 3.71 KB
<html lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
Slugify jQuery Plugin
<meta name="author" content="Patrick McElhaney">
<script src="" type="text/javascript"></script>
<script src="jquery.slugify.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$().ready(function () {
var pigLatin = function(str) {
return str.replace(/(\w*)([aeiou]\w*)/g, "$2$1ay");
$('#pig_latin').slugify('#title', {
slugFunc: function(str, originalFunc) { return pigLatin(originalFunc(str)); }
<style type="text/css">
body {
margin-top: 1.0em;
background-color: #ffffff;
font-family: Helvetica , Arial, Sans-Serif;
color: #000000;
#container {
margin: 0 auto;
width: 700px;
h1 { font-size: 3.8em; margin-bottom: 3px; }
h2 { font-size: 1.5em; }
h3 { text-align: center; }
.description {
font-size: 1.2em;
margin-top: 30px;
font-style: italic;
.download { float: right; }
pre { background: #000; color: #fff; padding: 15px;}
hr { border: 0; width: 80%; border-bottom: 1px solid #aaa}
<div><a href=""><img style="position: absolute; top: 0; right: 0; border: 0;" src="" alt="Fork me on GitHub" /></a></div>
<div id="container">
A jQuery plugin that automatically creates slugs as you type. Try it:
<label for="title">Title</label> <input type="text" name="title" value="" id="title" size="60">
<label for="slug_input">Slug</label> <input type="text" name="slug" id="slug_input" value="" class="slug" size="60">
Your URL is<span class="slug"></span>.
The plugin takes one option, <var>slugFunc</var>, a callback function
that lets you customize how slugs are created. <var>slugFunc()</var>
takes two arguments. The first is a selector for the input field to be
translated to a slug. The second, optional argument is the original
slugFunc(), which you can use as a base.
<label for="pig_latin"></label>
<input type="text" name="pig_latin" value="" id="pig_latin" size="60">
var pigLatin = function(str) {
return replace(/(\w*)([aeiou]\w*)/g, "$2$1ay");
$('#pig_latin').slugify('#title', {
slugFunc: function(str, originalFunc) { return pigLatin(originalFunc(str)); }
<p>This plugin was created by <a href="">Patrick McElhaney</a> (
You can download this project in either
<a href="">zip</a> or
<a href="">tar</a> formats.
You can also clone the project with <a href="">Git</a>
by running:
<pre>$ git clone git://</pre>