Современные браузеры поддерживают так называемый raw формат URL, когда вместо адреса изображения в CSS и даже в HTML <img src=»…» /> можно задать закодированный массив бинарных данных картинки. Требования к формату raw, а вернее отличия в допустимых отклонениях от стандарта требует внимательно тестировать картинку под всеми требуемыми ТЗ браузерами.
Наиболее лояльные к формату кодирования Chrome и Opera (оба на движке chromium). Они рендерят, к примеру, картинку не взирая на пропущенный токен charset перед кодировкой:
|
|
<img src="data:image/svg+xml;utf8, ... "/> |
и наличие не urlencoded символов в коде.
FF и IE более принципиальны. Для FireFox важно указать токен charset перед utf8, а для IE придется еще и провести кодирование символов, так чтобы они соответствовали формату URL.
В javascript можно использовать ф-цию encodeURIComponent:
|
|
var img = $('img').get(0); img.attr(src, 'data:image/svg+xml;charset=utf8,' + encodeURIComponent('<svg ... </svg>')); |
Этот вариант удовлетворит всех.
Данная запись опубликована в 30.11.2018 01:06 и размещена в рубрике На первой полосе.
Вы можете перейти в конец страницы и оставить ваш комментарий.
Мало букафф? Читайте есчо !
Июль 3, 2017 г.
Так как все время по работе возникает необходимость добавления в шаблоны хлебных крошек, то решил не лениться и оформить код в виде более универсального ...
Читать
Декабрь 27, 2014 г.
Речь пойдет о небольшой задачке, которая постоянно всплывает при переносе данных со старых сайтов на новые.
Т.е. новый сайт уже готов, но есть старый, на котором какое то количество статей, требующих аккуратного переноса, при чем они содержат картинки. ...
Читать
Июль 2, 2013 г.
Обратно я в тот день и не собирался, так как миссия по сути была выполнена (доехали, мясо пожарили и сожрали). Но Леха почему то сильно рвался домой. Как ...
Читать
Апрель 16, 2016 г.
Все материалы Wordpress хранит в одной таблице. Там он сохраняет записи, страницы, описания медиафайлов, черновики и ревизии. Они отличаются друг от друга лишь типом записи.
К этим "коробочным" типам можно добавить собственные, с уникальной конфигурацией ...
Читать