December 16, 2013 6:57 am

Create jQuery introductions step by step guide for your projects

As you all have this experience on Facebook when ever they start something new in there website give us an option for introduction and how that option can work so today I am going to show you something very related to that, It helps every web developer specially for those who is working on some new features on there website to highlight that feature you can use this introduction option.

Create jQuery introductions step by step guide for your projects example

Here is the HTML code with introduction tag:

In this HTML we used 2 new things for intro highlight which is data-step (step number like 1,3,5…) and data-intro (to show data which you want to explain).

You have to add libraries to do this in your website:

I have used a library intro.js and intro.css to perform this task.

There is two methods to initiate this procedure on page load or on click event so choice is yours.

Here is the example of onClick event start intro:

You can also start this on document ready here is the example:

For this article demo i have used a simple form field to show you how it works now you can customize it with your requirement.

All together HTML and jQuery

Here we have created a complete code to see its demo you need to just copy and past this in your project and enjoy.

Hope you like this article so please comment down your ideas and more changes and new articles.

Author Huzoor Bux

I am Huzoor Bux from Karachi (Pakistan). I have been working as a PHP Developer from last 5+ years, and its my passion to learn new things and implement them as a practice. Basically I am a PHP developer but now days exploring more in HTML5, CSS and jQuery libraries.

Tutorial Categories:
  • siddhu

    ya nice design, super but resize the logo

  • Andrew

    How to show this tutorial only once on the page when a user lands on that tutorial page, on your demo page, when i refresh the intro starts back, it should be shown only once. right?

    • That you can do with database in php or use cookies to save that user visits your page.