如何重复使用此脚本而不重复多次? (相对于div-size脚本的字体大小调整)

时间:2012-10-03 19:59:17

标签: javascript jquery font-size

我在网上发现了这个代码,对我来说非常特别....但是,我需要它才有点特别......

此代码不适用于多个div。我需要复制代码才能使其工作,并将类名fmor newswrap更改为newsrap2,依此类推。这将导致像我这样的杂志的代码很多。

是否有人知道如何处理此代码以使其适用于多个div?

PS,我现在在header.php中得到了15个这样的

$(document).ready(function() {
    var originalFontSize = 11.8;
    var sectionWidth = $('#newswrap8').width();

    $('#newswrap8 span').each(function(){
        var spanWidth = $(this).width();
        var newFontSize = (sectionWidth/spanWidth) * originalFontSize;
        $(this).css({"font-size" : newFontSize, "line-height" : newFontSize/0.9 + "px"});
    });
});

这是我使用的HTML代码

<div style="width:300px;">
<h3 id="newswrap8" style="margin:0px; font-size:12px;">
<span>
<a href="http://www.thelink.no">This is the page title</a>
</span>
</h3>
</div>

1 个答案:

答案 0 :(得分:1)

没有html-markup很难测试,但想法是:

$(document).ready(function(){
    var originalFontSize = 11.8;
    $('[id^="newswrap"]').each(function(){
        var elm = $(this),
            sectionWidth = elm.width();

        elm.find('span').each(function(){
            var spanWidth = $(this).width();
            var newFontSize = (sectionWidth/spanWidth) * originalFontSize;
            $(this).css({"font-size" : newFontSize, "line-height" : newFontSize/0.9 + "px"});
        });
    });
});