Useful Snippets

We have created some really useful functionality which surely going to make your Website more interactive. Here are a few of them:

Smooth Scrolling to Same Page Sections

With Canvas you can turn pretty-much any Page into a One Page Website, which defines Smart Functionality. You can Point any Link, Button on a Page to an Element ID which on Clicking scrolls to that Element.

You can use this functionality by adding data-scrollto="#html-element-ID" attribute to a Button or a Link. Simply use the following Sample Code to use this functionality:

Note: You should have a Valid & Unique Element ID on the Page where you are planning to use the ScrollTo Functionality.

Usage

<a href="#header" data-scrollto="#header" class="button button-3d">Scroll to Header</a>

Settings

Setting	Description
`data-offset`	Offset Gap from Top after you Scroll to the HTML ID in pixels. Example: `100`
`data-speed`	Speed of the Scroll To Link in milliseconds. Example: `800`
`data-easing`	Easing of the Scroll to Link Scrolling. Example: `easeInQuad`
`data-highlight`	Highlight Color of the Section in HEX Color Codes after scrolling. Example: `#FFFF00` Make sure that the `.highlight-me` Class is added to the Section you want to Highlight.