https://github.com/mike-zarandona/projectblocker

A handy jQuery solution for blocking responsive, IE, or incomplete bits from being seen while in development.
https://github.com/mike-zarandona/projectblocker

Last synced: about 2 months ago
JSON representation

A handy jQuery solution for blocking responsive, IE, or incomplete bits from being seen while in development.

• Host: GitHub
• URL: https://github.com/mike-zarandona/projectblocker
• Owner: mike-zarandona
• License: mit
• Created: 2015-02-06T21:53:34.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2015-02-09T14:05:49.000Z (almost 10 years ago)
• Last Synced: 2024-10-11T12:41:52.116Z (3 months ago)
• Language: JavaScript
• Homepage: http://codepen.io/mike-zarandona/full/bNYvmw/
• Size: 145 KB
• Stars: 12
• Watchers: 6
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ProjectBlocker

[![Bower version](https://badge.fury.io/bo/project-blocker.png)](http://badge.fury.io/bo/project-blocker)

[![Built with Grunt](https://cdn.gruntjs.com/builtwith.png)](http://gruntjs.com/)

A handy jQuery solution for blocking responsive, IE, or incomplete bits from being seen while in development.

[GitHub](https://github.com/mike-zarandona/ProjectBlocker) | [Demo](http://codepen.io/mike-zarandona/full/bNYvmw/)

_Features_:

- **Block responsive web design** - gives you the ability to demo coded previews without worrying about how the project might look on mobile devices.

- **Block the homepage** - show a polite message that a page isn't yet ready to be viewed to keep visitors out of broken or unfinished areas of preview sites.

- **Block Internet Explorer** - _duh_.

- **Customizable and friendly blocking messages** - because good UX is the right thing to do.

- **Bypass for developers** - for sanity.

![ProjectBlocker in Action](http://i.imgur.com/Vliy8dR.gif)




## Getting Started

1. Include jQuery.

1. Include `dist/jquery.projectblocker.min.js`.

1. When the `document` is `ready()`, initialize **`ProjectBlocker`**:

```javascript

$(document).on('ready', function() {

	$.projectBlocker();

});

```

### Full Example

```javascript

$(document).on('ready', function() {

	$.projectBlocker({

		responsive: 'hide',

		minWidth: 1200,

		homepage: 'hide',

		homepageSelector: '#wrapper.homepage',

		ie: 'hide'

	});

});

```

When all else fails, check out the `demo/`.




## A Note on Functionality

**`ProjectBlocker`** blocks responsive web design by throwing up the friendly blocking message plus overlay, but _also_ adds a CSS `max-width` property to the `