Sunday, April 15, 2018

How to zoom Image on hover image using jQuery | jQuery.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery spzoom Plugin Demo</title>
<link href="https://www.jqueryscript.net/demo/Simple-Image-Hover-Zoom-Plugin-With-jQuery-spzoom/jquery.spzoom.css" rel="stylesheet" type="text/css">
</head>
<body>
<li>
<a href="https://unsplash.it/600/450?image=319" title="@Naresh" data-spzoom>
    <img src="https://unsplash.it/200/150?image=319" alt="thumb"/>
</a>
</li>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://www.jqueryscript.net/demo/Simple-Image-Hover-Zoom-Plugin-With-jQuery-spzoom/jquery.spzoom.js"></script>
<script>
$(function() {
    $('[data-spzoom]').spzoom();
});
</script>
</body>
</html>



1 comment: