0

jqueryを使用して画面サイズが1000px未満になったら、このクラスを選択してspan12に変更するにはどうすればよいか疑問に思いました。

<div class="span4 minus65">

使ってます

$(window).resize(function(){
    if($(this).outerWidth() < 1000){
        $('.span4 minus65').attr('class',"span12");
    }

});

ただし、画面幅が1000px未満の場合は何も変わりません

4

3 に答える 3

2

複数のクラスを持つselect divの場合

$('.span4.minus65')

すべてのクラスを置き換えるには:

$('.span4.minus65').removeClass().addClass('span12');

または1つのクラスのみを置き換えます

$('.span4.minus65').removeClass('span4').addClass('span12');
于 2012-11-24T22:16:37.073 に答える
1

addClassremoveClass関数を使用したいようです

例えば

$(window).resize(function(){
    if($(this).outerWidth() < 1000){
        $('.span4 minus65').removeClass('span4').addClass('span12');
    }
});
于 2012-11-24T22:21:40.503 に答える
1

メディア クエリを使用できない場合は、「addClass」と「removeClass」を使用する必要があります。

$(el).addClass('span12').removeClass('span4');

ブラウザによっては、「サイズ変更」が発生する場合もあれば、頻繁に発生する場合もあります。「サイズ変更」イベントで使用している関数を取得し、次のように定期的に起動する必要があります。

var resizeFunc = function(){
    //add/remove classes
};

//"fix" the sizing even if "resize" doesn't fire.
setInterval(resizeFunc(), 1000);

jQuery(document).resize(resizeFunc);

また、サイズ変更が発生します...たくさん。数百ミリ秒ごとに複数回起動しないように「スロットル」することもできます。

おそらく、これにはメディア クエリの使用を検討する必要があります (これは、新しいバージョンの IE およびその他すべての最新のブラウザーで適切にサポートされています。

http://caniuse.com/#search=media%20queries

于 2012-11-24T22:22:17.007 に答える