javascript - 覆盖 SVG 内联样式

Question

 <svg id="mb-one_top" style="position: absolute; top: -215px;"  
 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"  
 preserveAspectRatio="xMidYMid" width="600" height="862" viewBox="0 0 600 862">

我试图让我的 SVG 在移动设备上更小，所以使用 jQuery 我写了:

var width = $(window).width();
if (width == 320) {
    $('#mb-one_top').attr('width', '350');
}

但它并没有覆盖并使我的 SVG 宽度从 600 变为 350，知道吗？

Answer 1

我认为您可以使用这样的 CSS 代码轻松实现此目的

<style>
    /* styles for mobile browsers smaller than 480px; (iPhone) */
    @media (max-width:480px){
        #mb-one_top {
             width : 350px;
        }
    }
</style>