0

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

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

这是我在模板中的内容：

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

不幸的是，这根本没有做任何事情..

有任何想法吗？

4

1 回答 1

1

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

var hoverSize = [100, 400];

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

这是一个演示http://jsfiddle.net/TSF46/

这向你展示了如何在你的 js 中使用上下文变量，看看它你已经知道了。

编辑：您可以替换.hover(...)为.toggle(...)参见http://jsfiddle.net/TSF46/1/ ​</p>

于 2012-03-10T17:01:19.133 回答