0

我的应用程序中有 2 个 div，每个都有 2 个不同的图像尺寸，单击时我需要在它们之间切换类。一切正常，但是。

将 big_div 类切换到 small_div 效果很好。没有问题，没有图像动画

但是切换到 small_div 到 big_div 会显示一些从当前尺寸到建议的大尺寸的图像动画。

如何在没有动画的情况下改变类的实例宽度？代码看起来像

CSS

.big_div {
width:600px;
height:400px;
float:left;
border:1px solid #cacaca;
}

.big_div img {
width:150px;
height:100px;
float:left;
margin:10px;
}


.small_div {
width:600px;
height:400px;
float:left;
border:1px solid #cacaca;
}

.small_div img {
width:300px;
height:200px;
float:left;
margin:10px;
}

HTML

<body>
<div id="big" class="big_div"></div>
<div id="small" class="small_div"></div>
<a id="switch">Click</a>
</body>

JS

$(document).ready(function(){

$('#switch').click(function(){
        $('#big').switchClass( "big_div", "small_div",1 );
        $('#small').switchClass( "small_div", "big_div",1 );

});

});

任何想法 ？

4

2 回答 2

0

我猜 toggleClass 是你想要的。但是 switchClass 也应该可以工作。

可能是因为您使用的 jQuery 和 jQueryUI 的版本。我用 jQuery 1.8.2 和 jQuery UI 1.8.9 测试了它们。他们都工作得很好。

于 2013-01-04T05:13:38.623 回答
0

toggleClass改为使用

$('#switch').click(function(){
    $('#big, #small').toggleClass("big_div small_div");
});

参考

于 2013-01-04T04:30:20.227 回答