🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

A jQuery plugin that new layout or new features using guide.

Plugins Web

Documentation

jQuery Guide

Build Status

A jQuery plugin that new layout or new features using guide

View the demo

http://panlatent.github.io/jquery-guide/

How to using

  • Download this library:
<script src="jquery.guide.js"></script>
  • Bower: bower.json:
  {     "dependencies": {       "jquery-guide": ">=1.0.0"     }   }

Example

var guide = $.guide({ 	actions: [ 		{ 			element: $('#domeStartGuideBtn'), 			content: '<p>Welcome, click on the screen at any position to enter the next step</p>', 			offsetX: -140, 			offsetY: 60 		}, 		{ 			element: $('#domeUsingPanel'), 			content: '<p>How to using...</p>', 			offsetX: -140, 			offsetY: 0, 			beforeFunc: function(g) { 				$('#domeUsingPanel').fadeIn(); 			} 		}, 		{ 			element: $('#domeGithubBtn'), 			content: '<p>Click here to access the project for Github</p>', 			offsetX: 0, 			offsetY: 50, 			isBeforeFuncExec: true, 			beforeFunc: function(g) { 				$('#domeGithubBtn').slideDown(function() { 					g.execAction(); 				}); 			} 		} 	] });

You May Also Like