2017-02-02 1 views
0

を入力してください。 widthsrcsrc属性.logo-wrap容器の画像は#となりました。幅が大きい場合はsrc attrが「オリジナル」として返されます。コードの最初の部分はうまくいきますが、ウィンドウを縮小してから大きく移動すると、src属性が残っています# ...jQueryの幅が小さい場合は、src srcを変更してください。それ以外の場合は、先に

何か提案がありますか?あなただけのバック属性を変更していないように見える事前

var $window = $(window); 

function checkWidth() { 
    var windowsize = $window.width(); 
    if (windowsize < 601) { 
     $(".logo-wrap img").attr("src","#"); 
    } 
    else {} 
} 
// Execute on load 
checkWidth(); 
// Bind event listener 
$(window).resize(checkWidth); 
+0

[メディアクエリ](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)を使用することがあります – gaetanoM

答えて

2
var $window = $(window); 

// creates an attribute called data-content for each image and stores it's src 
$(".logo-wrap img").each(function() { 
    $(this).data('data-content', $(this).attr('src')); 
}); 

function checkWidth() { 
    var windowsize = $window.width(); 
    if (windowsize < 601) { 
     $(".logo-wrap img").attr("src","#"); 
    } 
    else { 
     // changes each image's src to the link stored in data-content attribute 
     $(".logo-wrap img").each(function() { 
     $(this).attr("src", $(this).data('data-content')); 
     }); 
    } 
} 
// Execute on load 
checkWidth(); 
// Bind event listener 
$(window).resize(checkWidth); 

編集:JSFiddleを追加しました。

+0

ありがとうございます!私はそうしようと思っていましたが、変数を配線することで、とにかく "#"と思ったのです。 ありがとう! – Sieen

+0

問題ありません。属性を変更する前に保存する限り、属性は元のままです。すべてがうまくいけば答えを受け入れることができます。 –

+0

残念ながらよく見ていると、問題が発生することがわかりました... イメージが入った '.Logo-wrap'コンテナがさらにあります。ですから、スクリプトを大きくすると、最初のイメージのsrc属性が他のイメージすべてにコピーされます: - /あなたの提案はありますか? – Sieen

0

に おかげで、

function checkWidth() { 
    var windowsize = $window.width(); 
    if (windowsize < 601) { 
     $(".logo-wrap img, .lab-ah img").attr("src","#"); 
    } 
    else if (windowsize >= 601) { 
     $(".logo-wrap img, .lab-ah img").attr("src","original"); 
    } 
} 

は、私は私が正しくあなたの質問を理解願ってい

関連する問題