All Design Journal Notes Programming & Coding

CodeSlayer2010’s Code: jQuery Fancy Paragraph Styling (manila background, rounded-rectangle, drop-shadow, orange border)

screenshot of Eric CodeSlayer2010 Hepperle's jsfiddle jQuery -- fancy paragraph tag style 01
Jsfiddle Screenshot (07/13/13)

I wrote this jQuery in about 5 minutes. It is really simple, but amazingly powerful at the same time. The purpose of this is to instantly style paragraph tags. Here are the style parameters:

Background color: Manila (light beige-ish/yellow)
Border color: Orange
Drop-shadow: Yes
Rounded-rectangle: Yes

I want to make the code easily available to everyone, so I’ve provided the jQuery here in case you want to quickly add this style to your project. Cheers.

-CodeSlayer2010

[sourcecode language=”javascript”]
/* Add manilla background, rounded-rect, orange border,
& shadow to paragraphs.
(Press F12 in your browser to see the results)

@Creator: Eric Hepperle (CodeSlayer2010)
@Date: 07/13/13
@Version: 1.0

@Purpose: Puts a fancy style on paragraph <P>
tags to make them ‘pop’.

@Updates:
07/13/13
8:30 – Created initial code.

*/

console.clear()

$(‘p’).css({
‘border’: ‘solid #FFB819 3px’,
‘border-radius’:’15px’,
‘box-shadow’: ’10px 10px 5px #888888′,
‘background-color’:’#FFFBCC’,
‘padding’:’15px’
});
[/sourcecode]

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments