jQuery Blockrain.js Plugin
jQuery plugins enhance an application with features that would generally take a long time to program correctly. However, some plugins are useful in providing entertainment to users. Although many professional sites may not need these, it is a fun feature to include in personal blogs and websites.
Blockrain.js not only helps you embed the game but also allows you to customize certain elements such as
- You can change the theme to fit the color scheme of your website.
- You can adjust the speed of the blocks that are falling or as the name goes raining.
- You can choose to add a scoreboard.
- It has an autoplay feature which you can add.
The plugin is available on its website with the same name and it also has a Github repository dedicated to it with documentation.
Note: Before using it, download the files or the zip files and store them to implement in your project.
Download files from link:
The following code demonstrates the basic page structure using HTML tags to show the minimum requirement.
Note: For the CSS part, the stylesheet is linked which is provided by the plugin.
This involves basic jQuery syntax that involves a selector and the action.
- $ defines that jQuery is used.
- .game is the class of HTML.
Themes: We can customize this by adding a theme or whatever they have provided. Let us look at the sample code for that.
The options that are already provided are:
Many more are also provided.
Let us change the theme to one of these. All you need to do is add one statement to the already existing code:
It is highly customizable and for websites that would love to add some fun elements, this would be the perfect plugin for it.
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML course.