Проблема с заполнением (url #) при загрузке inline SVG

Question

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

Некоторое div показано первым, а остальные отображаются после перехода с JS. Внутри одного из этих divs у меня встроенный SVG. Когда первые DIV нагрузки (тот, который имеет SVG встроенный), он появляется OK, как на этой картинке:

https://drive.google.com/file/d/0B-1un9u8DWH-UExQeXpQOXJBMzA/edit?usp=sharing

Но, когда появляется DIV, который имеет встроенный SVG только после некоторого переходного периода, по-видимому таким образом:

https://drive.google.com/file/d/0B-1un9u8DWH-U0RHMnRoV3Y4OE0/edit?usp=sharing

дивы страдают переходы являются те, которые держат целые блоки (кроме блока родительского Div в с SVG инлайн). Похоже, что заполнение svg, которое вызывается url(#idofgradient), не найдено и не распознается. И заполнение, которое имеет только #F7F7F7, называется прекрасным (линейная часть SVG на середине изображения).

Я понятия не имею, что происходит в этом случае.

Если кто-нибудь может мне помочь, у вас есть моя благодарность.

Answer 1

Было бы неплохо увидеть какой-то код, но я думаю, что проблема, с которой вы сталкиваетесь, связана с встроенным заполнением. Удалите встроенную заливку и примените заливки с помощью css (если вы выполняете переходы заполнения).

.class{ 
fill:#aaa; 
} 
.class:hover{ 
fill:#fff; 
}