Перейти к содержанию

Рекомендуемые сообщения

Добрый день.

 

Решил сделать SVG спрайт для OC 2.02


<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#svg2"></use>

 

в html работает, а в tpl нет.

 

Это нормально?
 

 

Код:

<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" id="svg2" viewBox="0 0 406.00005 453.63127" height="17.145" width="15.345" clip-rule="evenodd" fill-rule="evenodd" image-rendering="optimizeQuality" shape-rendering="geometricPrecision" text-rendering="geometricPrecision">
<defs id="defs4">
<style id="style6">.fil1{fill:#bab8b0}.fil0{fill:#dddcd8}#svg2:hover .fil0,#svg2:hover .fil1{fill:#000}</style>
</defs>
<g transform="translate(-10592 -13743.369)" id="Layer_1">
<g id="_620838832">
<path id="path17" d="M10857 14157c0 7 1 12 4 17l7 12c2 1 1 1 3 2l8 5c6 4 13 4 21 4 18 0 36-18 36-35 0-13-2-22-11-31-12-13-30-16-46-8-2 2-4 2-6 4l-3 3c-7 6-13 17-13 27z" class="fil1" fill="#bab8b0"/>
</g>
</g>
</svg>

 

 

<svg width="48" height="48">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#svg2"></use>
</svg>

 

Что сделать, что бы можно было использовать SVG спрайты?

Например мне понравился метод через <svg><symbol><symbol><svg>

 

Благодарю.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Благодарю за помощь!!!

 

Я сделал как у вас, но видно не до конца...

В Хроме  и Опере видно иконки, а вот в Файерфоксе и Сафари просто пустое место вместо них.

 

 

Подключил через Local Storage <svg> с <symbol>

потом <svg> <use>

ЧТо-то я  не досмотрел.

Не подскажете что?

 

Вот, что у меня получилось:

http://test2.chromakey-production.com.ua/index.php?route=product/product&product_id=40

 

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Благодарю за помощь!!!

 

Я сделал как у вас, но видно не до конца...

В Хроме показывает, а вот в Firefox не хочет.

А на вашем сайте показывает.

 

Причем без опенкарта показывает.

http://test1.chromakey-production.com.ua/svg-sprite/

А с ним не хочет.

http://test1.chromakey-production.com.ua/index.php?route=information/information&information_id=9

В оранжевых прямоугольниках ожидались СВГ.

У всех, кроме файерфокса их показывает.

Скопировал стили родительских элементов и сам спрайт с вашего сайта.

JS, вроде как тут не участвует особо, кроме как при загрузке спрайта.

Перелопатил Гугль, были варианты, но не помогли.

Может ли это быть из-за разницы в версиях?

Вдруг будет минутка гляньте пожалуйста.

Благодарю вас.

 

Изменено пользователем paulittop

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.