jquery-ui - 对 CSS 解决方案的建议，以制作更小的预览 div

Question

如图所示，您可以看到左侧的 div 较大，右侧的 div 较小。较小的 div 基本上是一个预览 div，因此添加到左侧较大 div 的任何内容都应该重新调整大小并进入较小的 div。类似于 powerpoint 的东西
目前我正在这样做

$('#slideContent0').css('-ms-transform', 'scale(0.5, 0.5)');

但这似乎不起作用，我的意思是最初它运行良好，但是当我添加一些东西来滑动预览 div 看起来像这样

预览幻灯片的 HTML 类似于

<div class="leftPanelContent" id="leftPanelContent">
    <div id="slidePreview0" class="slidePreview">
        <div id="slideContent0" class="slideContent"></div>
    </div>
</div>

我正在使用的 CSS 是

.slidePreview {
    width: 98% !important;
    height: 150px !important;
    background-color: #FFFFFF;
    border-bottom: 20px solid #BCBCBC;
    cursor: pointer;
}

.slideContent {
    width: 100% !important;
    height: 130px !important;
    background-color: #fff;
    cursor: inherit;
}

有什么建议么