Category Archives: Web Development Tutorials

jquery mega menu

2 Demos of jQuery parallax plug-in: fallings

The fallings is a nice and simple jQueyr plug-in for creating the parallax effect in your website. The development version is only 4Kb file while production or minified file is only 2Kb.

jQuery histogram 2

2 Demos of jQuery histogram slider

The jquery-histogram-slider is a tiny and easy to use plug-in for creating the histogram slider on your website. The histogram is responsive and the slider is touch enabled as well.

jQuery scroll animation images

jQuery animate elements as in view (on scroll) plug-in

The jQuery-scroll-animate is a light-weight plug-in that is used to animate the elements in the view. That means, as the user scrolls down to the page, you may animate different elements as they appear on screen of the user. The section with animation may contain different elements like simple paragraphs, tables, forms etc.

Bootstrap table drag drop style

Rearrange Bootstrap table columns by drag and drop

The drag-n-drop-table-columns is a jQuery based plug-in for rearranging the table columns of the Bootstrap tables.

This is a simple plug-in, only 4Kb size that enables the visitors to re-arrange the table columns by drag and drop.

Bootstrap navbar left

Create fixed and Smooth Scroll Bootstrap 4 navbar by jQuery

For creating a top fixed navbar based on Bootstrap 4 that scrolls smoothly, you may use the bootstrap4-fixed-navbar plug-in for that. It is a jQuery based plug-in which is only 3K size. The minified version can be even less.

Bootstrap slider labels

7 styles of Simple and Range Bootstrap Sliders Using jQuery/JavaScript

By using the bootstrap-slider plug-in, jQuery based, you may create the simple or range slider with different styles in web pages. Easily integrate this into the forms for taking user’s input by way of sliding for selecting the value.

For example, selecting the age group, income range, salary expectation etc.

4 Demos of Bootstrap Tabs with Different Styles and Placements

In this core Bootstrap tabs tutorial, I showed how to create simple tabs for presenting the information. The tutorial included simple demos as well.

In this post, I am going to share an awesome plug-in for creating the tabs in Bootstrap with extended options. By using the bootstrap-tabs-x plug-in (jQuery based), you may place the tabs in different direction like top, bottom, left or right.

jQuery multi select options

jQuery Multi-select Dropdown with Checkbox and Searching: 3 Demos

By using the fSelect plug-in, you may create the simple or option group based select dropdowns that allow selecting one or more options. Each option in the dropdown has a checkbox with it while the selected value is also displayed on top.

Bootstrap date range datepicker

3 Demos of Bootstrap datepicker with jQuery

By using the bootstrap-datepicker plug-in, you may create a simple date picker that opens up as the input text field is selected or a component date picker that displays the calendar with text field focus as well as an icon ahead of it.

jQuery lightbox

4 Demos of jQuery lightbox plug-in for images, inline content and videos

The VenoBox is a jQuery based plug-in for creating the responsive modal windows for various type pf content. You may use it for presenting the images, Google maps, inline content and videos from different sources like YouTube and Vimeo.

The lightbox is fully responsive, so adjusts to the user’s screen nicely.