Эффект лупы для изображений

Речь пойдет об увеличении некоторого участка изображения для того, чтобы можно было по ближе рассмотреть. Такое часто используется в интернет-магазинах как фича.

Требования:

1. Jquery;
2. Jquery loupe

Установка:

1. Подключаем файлы.

<script src="assets/js/jquery1.8.3.min.js"></script>
<script src="jquery.loupe.min.js" type="text/javascript"></script>

2. Создаем разметку.

<a class="loupe" href="userfiles/images/image.png">
    <img src="userfiles/images/image.png" width="200" height="240"/>
</a>

3. Инициализируем.

$(".loupe").loupe({
    width: 50,     // ширина лупы
    height: 50,    // высота лупы
    loupe: "loupe" // css класс лупы
});