jQuery UI Trash Icon

Question

С некоторой помощью пользователей этого сайта мне удалось собрать фотогалерею this.

Вы увидите на странице примера, что я использую крест, чтобы разрешить пользователю удалять изображение. Проблема, с которой я сталкиваюсь, заключается в попытке изменить значок на значок jQuery UI 'trash'. Я нашел значок в вопросе, который является .ui-icon-trash, но я не могу найти никаких инструкций о том, как реализовать это на моей странице.

Кусок кода, который имеет дело со значком, как показано ниже:

.galleria-thumbnails .btn-delete {  
      display: block; 
      position: absolute; bottom : 0px; 
      width: 80px;  
      height: 80px;  
      cursor: pointer;  
      background: url(cross.png) no-repeat bottom; } 

Я попытался изменить url(cross.png) к url(.ui-icon-trash) и url(class=.ui-icon-trash) без какого-либо успеха. Я также, если возможно, хотел бы центрировать значок, а не его текущую позицию off-centre.

Я просто задавался вопросом, может ли кто-нибудь, возможно, взглянуть на это и сообщить мне, где я ошибаюсь.

Answer 1

Вы не можете сделать это, вы должны использовать HTML-код, как это:

<span class="ui-icon ui-icon-trash"></span> 

Это будет отображаться значок корзины.

В качестве файла значка нет изображения «корзины». Все значки хранятся в одном большом файле спрайтов «спрайт», а затем применяются некоторые правила CSS, чтобы отображать только запрошенный значок.

Answer 2

Если вы хотите сделать это JQuery способ это то, что вы ищете:

$(function() { 
    $('.btn-delete').addClass('ui-icon-trash'); 
});