環通100的背景圖像的onClick

b）和單條鏈路

背景圖像應該每次都改變爲在批次下一個鏈路是點擊，逐一瀏覽（如果顯示當前圖像的名稱/編號，會很好）。

圖像都在專用目錄中。 jQuery已經加載。

任何人都知道在哪裏可以找到代碼來做到這一點？

所有最好的...

2009-10-03 terrestrial

謝謝大家對你的那種反應。我欠'zdawg'一個額外的強大的'謝謝'他的周到和翔實的答覆和他的代碼，做我所要求的一切，像魅力的作品。問題已解決。 'stackoverflow'社區的岩石。所有最好的... – terrestrial 2009-10-04 12:16:19

你不一定需要硬編碼路徑到您的圖像的方式。您可以將圖像命名爲image_xxx.png，1 - 100，並在一個地方引用該名稱。這樣，如果您需要更改名稱，您可以在一個地方輕鬆完成。此外，請確保anchor標記的href屬性設置爲＃以防止每次單擊時重新加載頁面。

下面是一個更完整的解決方案，也做一系列的檢查，當我們達到我們的極限它環繞：

<script language="javascript" type="text/javascript"> 
<!--  
    var ctr = 0; 

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

    function nextBg() 
    { 
     ++ctr; 

     if(ctr <= 100) 
     { 
      $("body").css("background-image", "url(images/image_" + ctr + ".png)"); 
      $("#message").text("Current image: " + "image_" + ctr + ".png"); 
      if(ctr == 100) 
       ctr = 0; 
     } 
    } 
//--> 
</script> 
</head> 

<body> 
    <div> 
     <span id="message"></span><br /> 
     <a href="#" onclick="nextBg();" />Next</a> 
    </div> 
</body>

來源

2009-10-03 13:20:45 Zoltan

謝謝大家的好評。我欠'zdawg'一個額外的強大的'謝謝'他的周到和翔實的答覆和他的代碼，做我所要求的一切，像魅力的作品。問題已解決。 'stackoverflow'社區的岩石。所有最好的... – terrestrial 2009-10-04 12:14:29

var allImages = ["path/to/image2", "path/to/image1"]; 


$(document).ready(function() { 
    $("#theLink").click(function() { 
     var newImageLink = allImages.pop(); 
     $("body").css("background-image", "url(" + newImageLink + ")"); 
    }); 
});

來源

2009-10-03 12:54:55

（添加計數器GS的回答）

var allImages = ["path/to/image2", "path/to/image1"]; 
var counter = 0; 


$(document).ready(function() { 
    $("#theLink").click(function() { 
     var newImageLink = allImages.pop(); 
     $("body").css("background-image", "url(" + newImageLink + ")"); 
     $("#displayhere").html("<b>"+ counter +"</b>"); 
     counter = counter + 1; 
    }); 
});

來源

2009-10-03 13:08:26

環通100的背景圖像的onClick

回答

相關問題