2012-04-03 12 views
0

Ich benutze Drupal 7 und Ansichten Modul auf meiner Website. Und möchte Nummer auf meinen aktuellen Miniaturbildern zeigen. Suchen und finden Sie Stackoverflow diesen Code:Wie bekomme ich die Nummer des aktuellen Bildes in Javascript

HTML CODE: 
<img src="http://www.ambuvet.com/images/white-cat.jpg" /> 
<img src="http://www.biobest.co.uk/assets/images/diagnostics/cats.jpg" /> 
<img src="http://animal.discovery.com/guides/atoz/gallery/cat.jpg" /> 

JAVASCRIPT CODE: 
window.onload = function() { 
for (var i = 0; i < document.images.length; i++) { 
    var image = document.images[i]; 
    image.setAttribute("index", i + ""); 
    image.onclick = function() { 
     var index = this.getAttribute("index"); 
     alert("This is image #" + index); 
    }; 
} 
}; 

diesen Link sehen: http://jsfiddle.net/uUF8x/

Aber ich weiß nicht, wie ich diesen Code für get-Nummer auf dem aktuellen Thumbnail-Bild ersetzen. Vielen Dank.

+1

Immer Post einen entsprechenden Code ** in der Frage selbst **, verknüpfe nicht nur zu es. Warum: http://meta.stackexchange.com/questions/118392/add-stack-overfow-faq-entry-or-similar-for-putting-code-in-the-question –

+0

wie Menschen Ihnen helfen, wenn Sie sagst du nicht "willst"? – tusar

+0

Hat meine Post bearbeitet, sorry. – Karmacoma

Antwort

0

erstellen div mit Thumbnails als Hintergrundbilder wie

html

<div class="thumbnail" style="background-image: url(http://www.ambuvet.com/images/white-cat.jpg);width:100px;height:100px;"></div> 
<div class="thumbnail" style="background-image: url(http://www.biobest.co.uk/assets/images/diagnostics/cats.jpg);width:100px;height:100px;"></div> 
<div class="thumbnail" style="background-image: url(http://animal.discovery.com/guides/atoz/gallery/cat.jpg);width:100px;height:100px;"></div> 

js

window.onload = function() { 
    $(".thumbnail").each(function(index){ 
    $(this).html(index+1); // Will insert number inside div tag, use css to position it where you need 
}) 
};​ 
+0

Danke Sandeep Manne, kannst du diesen Code auf jsfiddle sehen? Danke vielmals. – Karmacoma

+0

überprüfen Sie diese http://jsfiddle.net/uUF8x/13/ –

+0

Vielen vielen Dank! Es ist großartig! – Karmacoma

Verwandte Themen