Как убрать границы загрузки gif на темном фоне? - PullRequest
1 голос
/ 08 июня 2019

Я пытаюсь создать диалог с загрузочным GIF без каких-либо границ или фона для моего веб-приложения. Я использую PrimeFaces для JSF. Я не могу удалить тень на границе. Вот изображение и код:

enter image description here

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:p="http://primefaces.org/ui">
    <style>
        .loadingPanel .ui-widget-content{
            background: transparent !important;
            border:none !important; 
            box-shadow:none !important; 
        }
    </style>

    <p:dialog widgetVar="loadingDialog" draggable="false" modal="true" closable="false" resizable="false" showHeader="false" styleClass="loadingPanel">
        <p:graphicImage name="images/loading_spinner.gif" library="ecuador-layout" />
    </p:dialog>

</html>

1 Ответ

4 голосов
/ 08 июня 2019

Проблема с форматом GIF.Он не поддерживает прозрачность альфа-канала, поэтому края прозрачных изображений могут выглядеть очень плохо (в зависимости от фона, на котором они отображаются).

Вместо анимации GIF вы можете использовать SVG-анимацию или анимированныезначок, например, используя PrimeIcons :

<i class="pi pi-spin pi-spinner" style="font-size: 3em"></i>

См. также:

...