Now days most of the websites are filled with advertisements and other stuff which distracts the user. But now you can provide distraction free view of web pages using jQuery to your readers. This is possible with a jQuery plugin called jCouch .
jCouch is a very lightweight jQuery plugin that provides you the feature of viewing a web page in distraction free mode. If your website is text oriented and the visitors of on your site prefer reading your site content then this plugin will allow the users to read your web pages in the most convinient way without being distracted by other less useful content on the site.
You need to include following files in your web page before using jCouch:
jCouch is a very lightweight jQuery plugin that provides you the feature of viewing a web page in distraction free mode. If your website is text oriented and the visitors of on your site prefer reading your site content then this plugin will allow the users to read your web pages in the most convinient way without being distracted by other less useful content on the site.
Features
- Light weight
- Easily customizable
- Zoom text feature
- Full jQuery Selectors Support
- Disable on pressing 'Esc'
How to Use
You need to include following files in your web page before using jCouch:
- jCouch CSS file
- jQuery library file
- jCouch JS file
Options
- target: (required, string) The elememts to be included in couch mode (comma separated).
- bgColor: (optional, string) Background color of the couch mode. Default is white
- width:(optional, string) Width of the content in couch mode. Default is full screen.
- amplify:(optional, numeric) Factor by which the text-size is to be zoomed.
//Code Starts $(function(){ // The selectors of couch buttons // Multiple selectors can be used to enable couch mode $('.couchBtn, .couchImg').jCouch({ target: 'h1,#post-data', //list of elements to be couched bgColor: '#ffffff', //background color width: '500px', //width of couched content amplify: 0.2 //Factor by which text is to be zoomed }); }); //Code Ends
Visit Official website for Live Demo
Feel free to contact me for any help related to jQuery, I will gladly help you.
No comments:
Post a Comment