悬停在 jQuery 后出现元素大小调整问题

Question

所以我遇到了 css 和 jquery 的问题。当前 jquery，在 window 加载和 window 调整大小时，动态调整某些元素的大小，使其在加载和浏览器 window 调整大小时都具有相同的高度和宽度，这是伟大的。

我的问题是，由于它只是内联的 css，一些元素在悬停时执行操作后会调整大小，并且它不会自动将新大小应用于所有其他元素。

我在想也许嵌入头部或 body 和 jQuery 操纵它，但我不知道这是否可能。

我乐于接受建议...

这是我正在做的，所以你可以自己看看：http://staging.idgadvertising.com/idg/do-not-touch/

//Resize videos and picture holders
    $(window).load(function(){
var frameWidth = $(".teammember").width();

var topTotal = parseInt(frameWidth) + 13;
$(".teammember").css("min-height", topTotal );
        $(".teammember").css("height", topTotal );
    });

$(window).resize(function(){
var frameWidth = $(".teammember").width();

var topTotal = parseInt(frameWidth) + 13;
$(".teammember").css("min-height", topTotal );
    $(".teammember").css("height", topTotal );
    });
 });

Answer 1

您的问题不在于 jQuery，而在于 float 属性。

在您的 CSS 中，从 #top .flex_column_table_cell 选择器中删除 float: none 属性。

或者如果您不能直接更改此 CSS，请尝试更改您的 window.load 函数以向每个 .teammember 元素添加一个 float 属性 :

$(window).load(function(){
    var frameWidth = $(".teammember").width();

    var topTotal = parseInt(frameWidth) + 13;
    $(".teammember").css("min-height", topTotal );
    $(".teammember").css("height", topTotal );
    $(".teammember").css("float", "left" );

});

顺便说一句，与团队成员相处得很好！ :)

杰伦干杯

编辑：添加了 jQuery 解决方案。

悬停在 jQuery 后出现元素大小调整问题

Element resizing issue after hover in jQuery

javascript

jquery

css

resize

dynamic-resizing