
To use a public method, you need to assign the element that you called.
data-magnify-afterload - equivalent to afterLoad, except the value must be a declared function nameĭisable zoom and reset to the original state. data-magnify-mobilecloseevent - equivalent to mobileCloseEvent.
data-magnify-limitbounds - equivalent to limitBounds. data-magnify-magnifiedheight - equivalent to magnifiedHeight. You can customize the hover effects based on your website’s design, to make it blend beautifully. The effects are entirely based on CSS3 and HTML5. It’s easier to have multiple effects in the same place and use them as needed. data-magnify-magnifiedwidth - equivalent to magnifiedWidth David Conner has put together an entire collection of CSS image hover effects. data-magnify-finalheight - equivalent to finalHeight. data-magnify-finalwidth - equivalent to finalWidth. data-magnify-touchbottomoffset - equivalent to touchBottomOffset. data-magnify-timeout - equivalent to timeout. data-magnify-speed - equivalent to speed. Options can also be set directly in the tag by adding the following data attributes, which will take precedence over the corresponding options set inside an object: This option is only applicable when the mobile plugin () is used.Īnonymous callback function to execute after magnification is loaded. Set this to 'click' or 'touchend' if it's conflicting with another event handler. Set this to true to keep the edge of the image within the magnifying lens.Ĭustom event to fire when you tap on the mobile close button. Set this only if you want to override the large image's native height. Height of the image displayed inside the magnifying lens. Set this only if you want to override the large image's native width.
Width of the image displayed inside the magnifying lens. If the image doesn't animate, then you should set the image height in CSS or via the height attribute. Set this only if the image animates into view and has a different initial height. If the image doesn't animate, then you should set the image width in CSS or via the width attribute. Set this only if the image animates into view and has a different initial width. Set this to something like 90 if you want to avoid your finger getting in the way of the magnifying lens on smartphones and tablets. Wait period in ms before hiding the magnifying lens on touch devices.
URI of the large image that will be shown in the magnifying lens.įade-in/out animation speed in ms when the lens moves on/off the image. The options below can be set in a JavaScript object when calling.