Tikslus Lens [ Click here to view DEMO ]

Thank you for purchasing Tikslus Lens. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

Getting started with Tikslus Lens

Download and Unzip:

  • Unzip the contents of the Zipped file you have downloaded from codecanyon.net.
  • place Tiksluslens.css in the directory where you have kept your other css files. (for example: in CSS folder)
  • Place Tiksluslens.min.js and jquery.min.js in your JS library.
  • Place loader Image (loader.gif) with Tiksluslens.min.js.


Add the following link and scripts tags with your proper paths and paste the following code within the Head tags of your HTML document.


How to use plugin ?

Tiksluslens works with two images one low resolution for the visible image, and one high resolution for the Lensed image.

Inside a DIV element place the low resolution image with data-big-image attribute which specifies the high resolution image.

HTML markup


Activate using Jquery selector

Using Jquery selectory inside $(document).ready() or $(window).load() to activate Lens.

ParameterDefault valueAllowed ValueDescription
lensWidth100Any number not greater than image WidthDefines the width of lens
lensHeight100Any number not greater than image HeightDefines the Height of lens
lensBackgroundColor#fffValid color code (HEX value)Defines the background color of lens
autoLensRatiofalseTrue or FalseIf true it will ignore lensWidth and lensHeight Parameter and sets lens width and height according to high resolution image