Navigation Menu

Skip to content

kmarryo/jquery.cookiefy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

37 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jquery.cookiefy

npm version Bower version

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>
    1. When using npm
    <script src="node_modules/jquery.cookiefy/dist/jquery.cookiefy.min.js"></script>
    1. When using CDN
    <script src="//cdn.jsdelivr.net/jquery.cookiefy/1.0/jquery.cookiefy.min.js"></script>
    1. 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 warning
text, 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 the
cookie-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
borderTop 1px solid #000 2px dotted green Sets the border-top value
zIndex 50 130 Set the z-index value of the cookie warning container
devMode false true On true no cookie will be set and the warning
shows 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