najazd na zdjęcie = pojawienie ikonki

Mam zdjęcia w tabeli, chciałbym teraz mieć coś takiego że najeżdżaj myszką na zdjęcie i np. w jego górnym rogu pojawia się ikonka czerwonego krzyżyka, po kliknięciu następuje skasowanie zdjęcia. Jak mogę to osiągnąć? czego mam poszukać?

latwo to zbudowac samemu w javascripcie.

wstawiasz obrazek, a na nim korzystajac z position: absolute nakladasz obrazek i ukrywasz go w css display:none

po najechaniu (akcja on hover, wywolanie zalezne od tego czy jquery czy vanilla) pokazujesz obrazek, ktory jest podlinkowany z akcja kasowania obrazek czy to poprzez <a href czy poprzez javascript.

LUB:

czysty CSS:

http://www.itsalif.info/content/show-play-icon-mouse-over-thumbnail-using-css

jQuery, ajax, coś w stylu:

$("#image-list .image").hover(function() { $(this).parent().find(".delete-icon").show(); }, function() { $(this).parent().find(".delete-icon").hide(); });
$("#image-list .image .delete-icon").click(function() {
	var image = $(this).parent().find(".image");
	$.ajax({
		url: heresYourUrlToRemoveAnImage,
		data: { src: image.prop("src") },
		success: function (data) { alert("Usunięte z wynikiem " + data); image.parent().remove(); },
	});
});

dla struktury

<div id="image-list">
	<div>
		<div class="delete-icon"></div>
		<img class="image" src="sourceUrlForImage" />
	</div>
	<div>
		<div class="delete-icon"></div>
		<img class="image" src="sourceUrlForImage" />
	</div>
...
</div>

Całość pisana z palca, więc nie musi działać, ale i tak chodzi tylko o pokazanie jak, a o bezmyślne nie skopiowanie. Klasa "delete-icon" zawiera definicję rozmiaru, tła z obrazkiem kosza czy iksa, display:none, no i oczywiście odpowiednie wypozycjonowanie obrazka usuwania.