Додавање скалабилне векторске графике (СВГ) у неподржани претраживач
У ранијем посту у овој серији, помињали смо мало о СВГ-овој замци са старим претраживачима и користили Рапхаел.јс да служе графици као алтернативно решење. У овом посту ћемо даље размотрити ову ствар.
Идеја је једноставна, и даље ћемо користити СВГ елементе као примарни начин за испоруку графике на нашој веб страници, али истовремено ћемо пружити функцију резервне функције тако да се може и даље приказивати у неподржаним прегледачима.
Наравно, постоје многи путеви које можемо подузети, али ћемо само погледати у два рјешења која мислим да је боље генеричко рјешење. Дакле, да видимо како то можемо.
Коришћење елемента објекта
Осим што је стављен директно у ХТМЛ документ, постоји неколико начина за уградњу СВГ-а. На пример, ако сачувамо графику .свг фајл, можемо користити елемент.
У сврху демонстрације, додали смо Аппле лого са СВГ-ом на нашу веб страницу. Међутим, неподржани прегледачи ће остати празни. Да бисмо ријешили проблем, можемо послужити Битмап графику, како слиједи;
На тај начин ће подржани прегледници и даље преузети .свг, док неподржани претраживачи носе Битмап графику. Додали смо “пнг” означите испод Аппле логотипа да бисте пратили који се графички материјал испоручује.
Међутим, као што смо споменули на другом мјесту, Битмап графика није толико флексибилна и скалабилна као СВГ. Дакле, погледајмо друго решење.
Усинг Модернизр
Други метод који можемо користити је употреба Модернизр. За оне од вас који нису упознати са овом ЈаваСцрипт библиотеком, не брините да ћемо имати посвећени пост да га покријемо. За сада, само држите корак са нама.
Прво, припремимо неке потребне ЈаваСцрипт библиотеке, Модернизр.јс и Рапхаел.јс. Затим, такође морамо да претворимо наше .свг са овим алатом, у формату који подржава Рапхаел, РеадиСетРапхаел.јс и сачувајте излаз у засебном формату .јс филе; рецимо свг.јс.
Укључите Модернзр.јс у ХТМЛ документ, на пример:
И за друга два фајла, рапхаел.јс и свг.јс, оптерећујемо га условно, само када је приказана у неподржаним прегледачима.
Са Модернизр-ом можемо да откријемо могућности претраживача, у овом случају ћемо открити да ли је претраживач способан да прикаже СВГ, а ако није, послужит ћемо скрипту:
иф (! Модернизр.инлинесвг) доцумент.врите (''
