jquery.cookiefy

Lightweight jQuery plugin to the EU cookie laws

Demo: kmarryo.github.io/jquery.cookiefy

Installation

1. Install via either bower, npm or downloaded files:

   1. via bower: bower install --save jquery.cookiefy
   2. via npm: npm install --save jquery.cookiefy
   3. via CDN (jsDelivr)
   4. via downloaded files

2. Include jquery.cookiefy in your HTML.

   1. When using bower

   <script src="bower_components/jquery.cookiefy/dist/jquery.cookiefy.min.js"></script>

   2. When using npm

   <script src="node_modules/jquery.cookiefy/dist/jquery.cookiefy.min.js"></script>

   3. When using CDN

   <script src="//cdn.jsdelivr.net/jquery.cookiefy/1.0/jquery.cookiefy.min.js"></script>

   4. When using downloaded files

   <script src="YOUR_PATH/jquery.cookiefy.min.js"></script>

Usage

$('body').cookiefy();

Optional Parameters

Define your own text and styles for the eu-cookie warning.

| Name | Default | Sample | Description | |---|---|---|---| | displayedHtml | warning text* | | You can insert your own cookie warningtext, e.g.with a link to your cookie policy site. | | closeButtonUrl | | close-btn.png | Change the close button. Valid parameters:relative/absolute image url or base64 string | | backgroundColor | #bebebe | tomato | Changes the background-color of thecookie-warning. | | color | #000 | #fff | Sets the color. | | fontFamily | | Helvetica | Sets the font-family | | fontSize | | 1.25em | Sets the font-size. | | borderTop | 1px solid #000 | 2px dotted green | Sets the border-top value. | | cssPrefix | cookiefy_ | my-own-page_ | Set the css id prefix for all created DOMelements and for the cookie name | | devMode | false | true | On true no cookie will be set and the warningshows up every time you open the page. |

*We use cookies to ensure that we give you the best experience on our website. If you continue, you agree with <strong>our cookie policy</strong>.

Example

$('body').cookiefy({
    backgroundColor: 'dimgray',
    color: 'ghostwhite',
    fontFamily: 'Helvetica',
    fontSize: '1rem',
    borderTop: '1px solid #000',
    closeButtonUrl: 'https://cdn3.iconfinder.com/data/icons/interface/100/close_button_1-512.png'
});

Customize via CSS

You can style this three css ids:

• #cookiefy_bar (complete cookie message div)
• #cookiefy_cookie-text
• #cookiefy_close (close button)

License

MIT