Created
January 27, 2013 11:43
-
-
Save cnocon/4647997 to your computer and use it in GitHub Desktop.
A CodePen by Cristin O'Connor. Style only certain words with jQuery - I had to do this for a recent site cut I did. I borrowed from Chris Coyier but lightened up the code a bit for my purposes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="beta"> | |
<nav id="nav" class="site-nav" role="navigation"> | |
<ul class="depth_1"> | |
<li class="first" id="nav_41633"><a href="/about-rop/">About ROP</a></li> | |
<li id="nav_41635"><a href="/editorial-advisory-board/">Editorial Advisory Board</a></li> | |
<li id="nav_41636"><a href="/editors-and-staff/">Editors and Staff</a></li> | |
<li id="nav_41637"><a href="/submit-a-manuscript/">Submit a Manuscript</a></li> | |
<li id="nav_41638"><a href="/book-reviews/">Book Reviews</a></li> | |
<li id="nav_41639"><a href="/subscriptions/">Subscriptions</a></li> | |
<li id="nav_41640"><a href="/back-issues-and-archives/">Back Issues and Archives</a></li> | |
<li id="nav_41643"><a href="/rop-perspectives/">ROP Perspectives</a></li> | |
<li class="last" id="nav_41644"><a href="/permissions-and-advertising/">Permissions and Advertising</a></li> | |
</ul> | |
</nav> | |
</div> <!-- .beta --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$(document).ready(function() { | |
$('#nav a, .page-title').each(function() { | |
var words = $(this).text().split(' '); | |
$(this).empty().html(function() { | |
for (i = 0; i < words.length; i++) { | |
if (words[i] == 'and' || words[i] == 'a' || words[i] == 'in' || words[i] == 'the' || words[i] == 'of' || words[i] == 'ROP') { | |
if (words[i] == 'ROP') { | |
$(this).append('<i class="rop"> ' + words[i] + '</i>'); | |
} else { | |
$(this).append('<i> ' + words[i] + '</i>'); | |
} | |
} else { | |
$(this).append(' ' + words[i]); | |
} | |
} | |
}); | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.beta {display:block; border-radius:2px; width:35%} | |
.site-nav .depth_1 {list-style:none; background:#e1d99b;} | |
.site-nav .depth_1 li {margin:0;} | |
.site-nav .depth_1 a {display:block; padding:.7em .9em; line-height:1em; text-decoration:none; text-transform:uppercase; font-family: Futura, "Trebuchet MS", Arial, sans-serif; color:#10447c; border-bottom:none;} | |
.site-nav .depth_1 a i {text-transform:lowercase; font-style:italic; font-weight:bold; font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif; font-size:.95em;} | |
.site-nav .depth_1 a .rop {text-transform:uppercase; font-weight:normal; font-size:1.0526315789em; font-family: Futura, "Trebuchet MS", Arial, sans-serif;} | |
.site-nav .depth_1 a:hover {color:#10447c; background:#d8d092;} | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment