Jquery, django, картинка Увеличить на клик или наведите курсор

Question

Я храним изображения в качестве файлов в базе данных Django.В шаблоне, если вы выберете определенную опцию из раскрывающегося коробки, сохраненное изображение для этой опции отображается в установленном небольшом размере. Это все сделано с помощью jQuery ..

На щелчке на рисунке или зависание на него (в зависимости от того, что проще), я хочу увеличить изображение к его первоначальному размеру.Нажав снова, я хочу сделать его меньше (или, если я парю, когда мыумешится перемещается, он должен вернуться к маленькому размеру).

Вот что у меня в шаблоне:

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

.

К сожалению, это не делает ничего вообще ..

Есть идеи?

Answer 1

Not sure where you'd get the data for the original size from but here is a way to resize an image,

var hoverSize = [100, 400];

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

heres a demo http://jsfiddle.net/TSF46/

This shows you haw to use context variables in your js, which looking at it you already know.

Edit: You can replace .hover(...) with .toggle(...) see http://jsfiddle.net/TSF46/1/ ​