Skip to content

A lightweight jQuery plugin to set and get the css of pseudo elements

Notifications You must be signed in to change notification settings

ReallyGood/jQuery-cssP

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

##jQuery cssP - Play with the css of Pseudo Elements jQuery cssP is a lightweight plugin, letting you set and get the css of pseudo elements.

Demo

Check out the DEMO page (or look at index.html).

Known Limitations

  1. In its current form, it only gets the styles which the plugin itself has set.
  2. The plugin doesn't work well with compound selectors (see issue #1).

Usage:

Setter

$('#myThing').cssP({
    before: 'margin-left: 10px;', // String, the ruleset itself (cssP adds selector & braces)
    after: function(){ // or a Function, which returns a ruleset string.
		// For the hell of it, say we want to note the time in a random color (WAT?!)
		var timestamp = 'content: " by the way, it is now ' + new Date().toGMTString() + '";'
		var randomColor = '#'+Math.floor(Math.random()*16777215).toString(16);
		return timeStamp + 'color: ' + color;
	}
});

Getter

Say you previously did something like:

$('h2').cssP({
    before: 'background: hotpink;',
    after: 'content: "!";'
});

To get it back, you can do either:

$('h2').cssP('before');
// content: "!";

Or add true as a second parameter to get the full stylesheet for this selector:

$('h2').cssP('before', true);
// You'll get both rules back no matter what you wrote as the first parameter:
// h2:before {background: hotpink;}
// h2:after {content: "!";}

Enjoy, contribute and spread the word! — Really Good

About

A lightweight jQuery plugin to set and get the css of pseudo elements

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published