相关疑难解决方法(0)

我有一个带有两个类的元素,一个称为"旋转",将元素旋转360度,另一个称为"双面",将元素缩放为正常大小的2倍:

.rotate {
    transform: rotate(0deg);
}

.rotate:hover {
    transform: rotate(360deg);
}

.doublesize {
    transform: scale(1);
}

.doublesize:hover {
    transform: scale(2);
}

http://jsfiddle.net/Sbw8W/

我猜这不起作用,因为类重写了彼此的transform属性？

我知道我可以轻松地在一个CSS规则中执行此操作,例如:

.doublerotatesize {
    transform: scale(1) rotate(0deg);
}

.doublerotatesize:hover {
    transform: scale(2) rotate(360deg);
}

但是如果可能的话,我希望能够将每个类别与另一个类别分开.

我很困惑.为什么我不能同时使用刻度和旋转？我试过这个,但它不起作用:

.rotate-img{
    -webkit-transform:scale(2,2);
    -webkit-transform:rotate(90deg);
    margin-left:20%;
    margin-top:10%;
}

我尝试过jQuery,但两种方法都不起作用:

<style>
.zoom{
        -webkit-transform:scale(2,2);
        margin-left:20%;
        margin-top:10%;
    }
</style>
<script>

    $(document).ready(function(){
        $("img").dblclick(function(){

            $(this).addClass("zoom");

            $(this).contextmenu(function(){
                $(this).css("-webkit-transform","rotate(90deg)");
                return false;
            })
        });
    })

    </script>

我怎么能缩放img,当我点击右键然后旋转90度.