0

私はサイトでメディア クエリを使用することを検討してきましたが、3G 経由で iPhone にダウンロードするのに時間がかかるためだけに、巨大なファイルをダウンロードするというアイデアに飛びつきました。

jquery を使用してファイル名を変更することは可能ですか (つまり、-iphone を background.jpg に追加して background-iphone.jpg を作成します)、サイトが iphone / ネットブック / iPad でおそらくメディア クエリを使用して表示されている場合です。

私の頭では、それが可能であるように思えます。誰かがそれを解決できれば素晴らしいことです:-D

前もって感謝します

ストゥ

画面サイズを見つけるためのこのコードを見つけました

$(document).ready(function() {

if ((screen.width>=1024) && (screen.height>=768)) {
alert('Screen size: 1024x600 or larger');
$("link[rel=stylesheet]:not(:first)").attr({href : "detect1024.css"});
}
else  {
alert('Screen size: less than 1024x768, 800x600 maybe?');
$("link[rel=stylesheet]:not(:first)").attr({href : "detect800.css"});
}
});

そして、ファイルにテキストを追加すると思われるこのスクリプトを見つけました

$('.rollover').hover(
        function(){ // Change the input image's source when we "roll on"
            var t = $(this);
            t.attr('src',t.attr('src').replace(/([^.]*)\.(.*)/, "$1-over.$2"));
        },
        function(){ 
            var t= $(this);
            t.attr('src',t.attr('src').replace('-mobile',''));
        }
 );

2つを組み合わせる方法はありますか??

多分このようなもの -

$(document).ready(function() {

if ((screen.width>=1024) && (screen.height>=768)) {
var t= $(this);
t.atter('src',t.attr('src').replace('-mobile',''))
}
);

しかし、構文エラーを修正する方法がわかりません

または、これかもしれませんが、まだ終了構文エラーがあります

$(document).ready(function() {

if ((screen.width>=1024) && (screen.height>=768)) {

   var re = new RegExp("(.+)_hover\\.(gif|png|jpg)", "g");
   return filename.replace(re, "$1.$2");
}
4

2 に答える 2

3

それは可能であり、達成するのもそれほど難しくありません。しかし、簡単にするために、次のようなものを使用してみませんか。

$(document).ready(function() {

  if ((screen.width<=960) && (screen.height<=640)) {

    $("#someid").addClass("iphone");

  }

});

これにより、ブラウザが960x640（iPhone 4の解像度）以下の解像度を検出すると、指定した要素に「iphone」のクラスが自動的に追加されます。これは、bodyタグ、カスタムIDなどである可能性があります。

次に行う必要があるのは、クラス「iphone」に別の背景画像を指定することだけです。

単純。

于 2010-08-06T20:22:54.560 に答える
0

または、イメージ タグを使用できるソリューションについては、以下を参照してください。

$(document).ready(function() {

  if ((screen.width<=960) && (screen.height<=640)) {

    $("img").attr("src", $("img").attr("src").replace(/([^.]*)\.(.*)/, "$1-iphone.$2"));

  }

});

これでうまくいくはずです。

于 2010-08-06T22:47:38.950 に答える