0

すべてのバージョンの Internet Explorer で jQuery コードをレンダリングするのに問題があります。FF、Chrome、Safari、Opera でうまく機能します。コードは、タグの直前の html ファイルの下部にあります。また、タグの前の上部にあるコードを試してみましたが、うまくいきませんでした。これがスケーラブルな Web サイトでセットの位置とサイズを設定する適切な方法かどうかはわかりませんが、コードは次のとおりです。

    $(document).ready(function(){
    resizeDiv();
});

window.onresize = function(event) {
    resizeDiv();
}

function resizeDiv() {
    mainheight = $(window).width() * .7275;

    //Adjusting height
    $('#main').css({'height': mainheight + 'px'});
    $('#content').css("height", $('#content').width() / 3.9608 + "px");

    //Adjusting width
    $('#aacsbbottomimage').css("width", $(window).width() / 9.9365 + "px");
    $('#checkimg1').css("width", $(window).width() / 12.52 + "px");
    $('#checkimg2').css("width", $(window).width() / 12.52 + "px");
    $('#checkimg3').css("width", $(window).width() / 12.52 + "px");

    //Adjusting top positions
    $('#content').css('top', mainheight * .485 + 'px');
    $('#header').css('top', mainheight * .05 + 'px');
    $('#contentheading').css('top', mainheight * .43 + 'px');
    $('#footer').css('top', mainheight * .9 + 'px');

    //Adjusting font sizes
    $('#whiteheader').css("font-size", mainheight / 16.2396 + "px");
    $('#blueheader').css("font-size", mainheight / 16.2396 + "px");
    $('#headerparagraph').css("font-size", mainheight / 56.25 + "px");
    $('#contentheading').css("font-size", mainheight / 47.3684 + "px");
    $('#submitbutton').css("font-size", mainheight / 69.2307 + "px");
    $('#one').css("font-size", mainheight / 55 + "px");
    $('#two').css("font-size", mainheight / 55 + "px");
    $('#three').css("font-size", mainheight / 55 + "px");
    $('#formtext').css("font-size", mainheight / 57 + "px");
    $('#footer').css("font-size", mainheight / 75 + "px");
    $('#section1').css("font-size", $(window).width() / 130.5 + "px");
    $('#section2').css("font-size", $(window).width() / 145.5 + "px");
}
4

1 に答える 1

0

IE10 ではフィドルは問題ないように見えますが、何を探すべきかはよくわかりませんが、Opera 12.15 よりも優れているかもしれません。

フィドルとあなたが説明するコードの主な違いは、スクリプトがドキュメント内のどこに配置されているかです。

<head>...</head>次のように、ドキュメントのand フレーズに移動してみてください。

$(function() {
    $(window).on('resize', function() {
        ...
        ...
        ...
    }).trigger('resize');
});

それが勝負のチャンスになる。

于 2013-06-15T03:22:47.027 に答える