Home >
Article > Web Front-end > Fixie.js plug-in to automatically fill content_javascript skills
Fixie.js plug-in to automatically fill content_javascript skills
WBOYOriginal
2016-05-16 17:52:21820browse
Fixie.js is an open source tool that automatically fills in the content of HTML documents Official website address: http://fixiejs.com/ Fixie.js download addressfixie_jb51.rar
Why use Fixie? When we design a website, because we cannot determine the final filled content, we often need to add lorem ipsum (about Lorem ipsum) to the page to preview the display effect of the page. The problem is that adding too much boring content makes our HTML document bloated and falls into a cycle of copy-paste and manual editing. Fixie.js was born to address this problem. By parsing semantic HTML5 tags, Fixie can automatically fill in content that matches the tag element type, making our HTML documents concise and testing efficient.
Instructions for use: Step 1: Add fixie.js to the document Add
Step 2: There are two methods here:
1. Wherever content needs to be filled, set `class="fixie" `That’s it. For example, if you fill in the content of the p tag first, just set `
` directly, over, it’s that simple. 2. Fill the content through `fixie.init` Select the elements to be filled through the CSS selector, and execute
fixie.init(( [".array", "#of > .selectors", ".that", ".should", "#be > .populated", ".with", ".lorem"]) or fixie.init(".string, #of > .comma, .separated, .selectors, .that, .should, #be > .populated, .with, .lorem") command, you can Automatically filled in In addition, executing
fixie.init(':empty') can fill in all empty elements in the document;
Supported elements Fixie is The filled content is determined by the tag type. There are several categories that need to be understood. - `` - add a few words of text, same with `h2 - h6`. - `` - Fill in a paragraph of text - `` - Fill in several paragraphs Text (several paragraphs) - `` - Same as above - `` - Fill in a picture with the size indicated - `` - Fill in a random link (suspected for advertising?)
Tips Modify the default image padding Execute `fixie.setImagePlaceholder(source)`. For example, if you want to download images from Flickr to fill, you can execute
fixie.setImagePlaceholder('http ://flickholdr.com/${w}/${h}/canon').init(); Add class="fixie" to the container All non-empty descendant elements inside the container (note the descendants and offspring) will be affected See the instructions below