jQuery滾動圖片src更改問題

Question

您好！

我有一些jQuery的可怕的問題。如果用戶滾動頁面，我希望我的腳本更改徽標圖像。非常簡單，但它不起作用。只要我滾動我的頁面，圖片消失，並在我回到頁面頂部後不會回來。對新手問題抱歉，但我已經與它戰鬥了3個小時。像http://www.webdesignerdepot.com/2013/03/how-to-create-a-resizing-menu-bar/這樣的東西沒有幫助。我確信我的圖片來源是正確的，因爲在加載頁面時會加載大標誌。

的JavaScript：

$(document).ready(function() { 

    $(document).scroll(function() { 
    if ($(document).scrollTop()>1){ 
     $('#logo').attr('src', "Source\Pictures\Logo_small.jpg"); 
     } 
    else { 
     $('#logo').attr('src', "Source\Pictures\Logo.jpg"); 
     } 
    }); 
}); 

HTML：

滾動後：

<img src="Source\Pictures\Logo.jpg" id="logo"> 

<script src="Source\JavaScript\jquery-3.2.0.js"></script> 
<script type="text/javascript" src="Source\JavaScript\index.js"></script> 

滾動之前

Answer 1

使用反斜槓（\）在一個字符串中，你應該加倍他們（\\）。這是因爲反斜槓是一個轉義字符，所以字符串的內容可能與您期望的不同。

$(document).ready(function() { 

    $(document).scroll(function() { 
    if ($(document).scrollTop()>1){ 
     $('#logo').attr('src', "Source\\Pictures\\Logo_small.jpg"); 
     } else { 
     $('#logo').attr('src', "Source\\Pictures\\Logo.jpg"); 
     } 
    }); 
}); 

理想情況下，您應該使用正斜槓，因爲反斜槓只能在Windows本地工作。 Windows中也支持正斜槓。

$(document).ready(function() { 

    $(document).scroll(function() { 
    if ($(document).scrollTop()>1){ 
     $('#logo').attr('src', "Source/Pictures/Logo_small.jpg"); 
     } else { 
     $('#logo').attr('src', "Source/Pictures/Logo.jpg"); 
     } 
    }); 
});