Jquery、Django、单击或悬停时放大图片

我将图像作为文件存储在django数据库中。在模板中，如果从下拉框中选择某个选项，则该选项存储的图片将以设定的小尺寸显示。。这都是使用jquery完成的

单击图片，或将鼠标悬停在图片上方（以较容易的为准），我希望将图片放大到其原始大小。再次单击时，我想使其变小，或者如果我在悬停，当鼠标移动时，它应该回到小尺寸

以下是我在模板中的内容：

    <script type = "text/javascript">
            $(function ()
            {
                    $("#image{{p.option}}").on('click', function ()
                    {
                            $(this).width(1000);
                    });
            });
    </script>

不幸的是，这根本没什么用

---

有什么想法吗

不确定从何处获取原始大小的数据，但这里有一种调整图像大小的方法

var hoverSize = [100, 400];

$('img').hover(function() {
    $(this).css({
        height: hoverSize[0],
        width: hoverSize[1]
    });​
}, function() {
    $(this).css({
        height: "",
        width: ""
    });
});

这里有一个演示

向您展示了如何在js中使用上下文变量，您已经知道了

编辑：您可以替换。悬停。。。使用。切换。。。看见 ​