Замяніць колер ўнутры PNG

У мяне ёсць сайт, дзе я хачу, каб змяніць колер малюнка.
У мяне ёсць просты PNG, як гэта:


enter image description here

Я хачу, каб змяніць колер ўнутры ў іншы, і пасля таго, як да іншага, калі я хачу.

Я паспрабаваў у гэтым рэжыме, але не працуе з SVG, не мяняе колер майго малюнка

 
 

Мне трэба рашэнне ў PHP або Javascript або JQuery, я бачыў бібліятэку GD ў PHP, але я хачу, каб прымяніць змяненне колеру да існуючага элементу з ідэнтыфікатарам, як мой вобраз.

Як вырашыць гэтую праблему?

2
Выкарыстанне SVG. Вы будзеце мець цалкам скрыпты DOM дрэва вашага малюнка даступна.
дададзена аўтар Bart Friederichs, крыніца
Выкарыстанне SVG. Вы будзеце мець цалкам скрыпты DOM дрэва вашага малюнка даступна.
дададзена аўтар Bart Friederichs, крыніца
@AlessandroMinoccheri SVG з'яўляецца фармат малюнка xml на аснове. Вы можаце выкарыстоўваць Inkscape для іх стварэння і/або лёгка інтэграваць іх у HTML. Нагрузкі інфармацыі можна знайсці ў Інтэрнэце пра гэта.
дададзена аўтар Bart Friederichs, крыніца
@AlessandroMinoccheri SVG з'яўляецца фармат малюнка xml на аснове. Вы можаце выкарыстоўваць Inkscape для іх стварэння і/або лёгка інтэграваць іх у HTML. Нагрузкі інфармацыі можна знайсці ў Інтэрнэце пра гэта.
дададзена аўтар Bart Friederichs, крыніца
@AlessandroMinoccheri выкарыстоўваць інструмент як Inkscape для стварэння SVG, рэдагаваць XML, каб дадаць ідэнтыфікатар атрыбуты, і вы можаце выкарыстоўваць document.getElementById() , каб атрымаць элементы і маніпуляваць імі. Вы нават можаце выкарыстоўваць jQuery або додзё.
дададзена аўтар Bart Friederichs, крыніца
@AlessandroMinoccheri выкарыстоўваць інструмент як Inkscape для стварэння SVG, рэдагаваць XML, каб дадаць ідэнтыфікатар атрыбуты, і вы можаце выкарыстоўваць document.getElementById() , каб атрымаць элементы і маніпуляваць імі. Вы нават можаце выкарыстоўваць jQuery або додзё.
дададзена аўтар Bart Friederichs, крыніца
@AlessandroMinoccheri выкарыстоўваць інструмент як Inkscape для стварэння SVG, рэдагаваць XML, каб дадаць ідэнтыфікатар атрыбуты, і вы можаце выкарыстоўваць document.getElementById() , каб атрымаць элементы і маніпуляваць імі. Вы нават можаце выкарыстоўваць jQuery або додзё.
дададзена аўтар Bart Friederichs, крыніца
Я магу мець усе магчымасці колеру і ў мяне ёсць каля 100 малюнка, якое можа быць правамі .. 100 * 16.000.000. ня possbile @webdevsoup
дададзена аўтар Alessandro Minoccheri, крыніца
Я магу мець усе магчымасці колеру і ў мяне ёсць каля 100 малюнка, якое можа быць правамі .. 100 * 16.000.000. ня possbile @webdevsoup
дададзена аўтар Alessandro Minoccheri, крыніца
не працуе, таму што ўжыць фільтр да ўсяго малюнку, і я хачу, каб прымяніць колер не ў фонавым рэжыме @roasted
дададзена аўтар Alessandro Minoccheri, крыніца
не працуе, таму што ўжыць фільтр да ўсяго малюнку, і я хачу, каб прымяніць колер не ў фонавым рэжыме @roasted
дададзена аўтар Alessandro Minoccheri, крыніца
Вы можаце прывесці прыклад? @Christoph
дададзена аўтар Alessandro Minoccheri, крыніца
Вы можаце прывесці прыклад? @Christoph
дададзена аўтар Alessandro Minoccheri, крыніца
нармальна прыклад з маёй справай? Я ніколі не выкарыстоўваў SVG @BartFriederichs
дададзена аўтар Alessandro Minoccheri, крыніца
нармальна, але я не разумею, як прымяніць да выявы, я бачыў, як перацягнуць круг і запоўніць яго, але ў мяне ёсць складанае @BartFriederichs малюнка
дададзена аўтар Alessandro Minoccheri, крыніца
нармальна, але я не разумею, як прымяніць да выявы, я бачыў, як перацягнуць круг і запоўніць яго, але ў мяне ёсць складанае @BartFriederichs малюнка
дададзена аўтар Alessandro Minoccheri, крыніца
нармальна, але я не разумею, як прымяніць да выявы, я бачыў, як перацягнуць круг і запоўніць яго, але ў мяне ёсць складанае @BartFriederichs малюнка
дададзена аўтар Alessandro Minoccheri, крыніца
з'яўляецца дынамічнае прызначэнне, у мяне ёсць ColorPicker, калі я выбраць малюнак, якое я хачу, я магу змяніць яго колер, і ў мяне ёсць яшчэ адзін DIV пад маім малюнкам, дзе ён можа быць рознага колеру, для гэтага мне трэба, што фон празрысты а не ўнутры .. @MarcB
дададзена аўтар Alessandro Minoccheri, крыніца
з'яўляецца дынамічнае прызначэнне, у мяне ёсць ColorPicker, калі я выбраць малюнак, якое я хачу, я магу змяніць яго колер, і ў мяне ёсць яшчэ адзін DIV пад маім малюнкам, дзе ён можа быць рознага колеру, для гэтага мне трэба, што фон празрысты а не ўнутры .. @MarcB
дададзена аўтар Alessandro Minoccheri, крыніца
з'яўляецца дынамічнае прызначэнне, у мяне ёсць ColorPicker, калі я выбраць малюнак, якое я хачу, я магу змяніць яго колер, і ў мяне ёсць яшчэ адзін DIV пад маім малюнкам, дзе ён можа быць рознага колеру, для гэтага мне трэба, што фон празрысты а не ўнутры .. @MarcB
дададзена аўтар Alessandro Minoccheri, крыніца
рэдагаваць пытанне на прыкладзе з SVG не працуе @BartFriederichs
дададзена аўтар Alessandro Minoccheri, крыніца
рэдагаваць пытанне на прыкладзе з SVG не працуе @BartFriederichs
дададзена аўтар Alessandro Minoccheri, крыніца
рэдагаваць пытанне на прыкладзе з SVG не працуе @BartFriederichs
дададзена аўтар Alessandro Minoccheri, крыніца
рэдагаваць пытанне на прыкладзе з SVG не працуе @Christoph
дададзена аўтар Alessandro Minoccheri, крыніца
рэдагаваць пытанне на прыкладзе з SVG не працуе @Christoph
дададзена аўтар Alessandro Minoccheri, крыніца
рэдагаваць пытанне на прыкладзе з SVG не працуе @Christoph
дададзена аўтар Alessandro Minoccheri, крыніца
Усе гэтыя вобразы збіраюцца простыя манахромныя абразкі? Калі гэта так, то проста зрабіць «колер» частка празрыстая, і выкарыстанне CSS/пазіцыянаванне/фонавы малюнак, каб «запоўніць» празрыстую вобласць з жаданым колерам.
дададзена аўтар Marc B, крыніца
Усе гэтыя вобразы збіраюцца простыя манахромныя абразкі? Калі гэта так, то проста зрабіць «колер» частка празрыстая, і выкарыстанне CSS/пазіцыянаванне/фонавы малюнак, каб «запоўніць» празрыстую вобласць з жаданым колерам.
дададзена аўтар Marc B, крыніца
Усе гэтыя вобразы збіраюцца простыя манахромныя абразкі? Калі гэта так, то проста зрабіць «колер» частка празрыстая, і выкарыстанне CSS/пазіцыянаванне/фонавы малюнак, каб «запоўніць» празрыстую вобласць з жаданым колерам.
дададзена аўтар Marc B, крыніца
чаму б вам не проста выкарыстоўваць просты SVG малюнак? Змяненне колеру лёгка Peasy з гэтым.
дададзена аўтар Christoph, крыніца
дададзена аўтар Christoph, крыніца
дададзена аўтар Christoph, крыніца
дададзена аўтар Christoph, крыніца
Вы на самой справе трэба змяніць колер стрэлкі, ці вы маглі б сысці з празрыстай стрэлкай альфа (з цвёрдым пярэднім планам - белым ў вашым прыкладзе), які паказвае іншы каляровы фон?
дададзена аўтар Pebbl, крыніца
Вы на самой справе трэба змяніць колер стрэлкі, ці вы маглі б сысці з празрыстай стрэлкай альфа (з цвёрдым пярэднім планам - белым ў вашым прыкладзе), які паказвае іншы каляровы фон?
дададзена аўтар Pebbl, крыніца
Ці мае гэта зрабіць на лета? Вы можаце проста змяніць колер стрэлкі ў Photoshop/GIMP, а затым з дапамогай Javascript і JQuery, каб памяняць фатаграфіі па-за домам?
дададзена аўтар webdevsoup, крыніца
Як аб выкарыстанні значка шрыфта (нагрузак распаўсюджаных тут )
дададзена аўтар naththedeveloper, крыніца
Як аб выкарыстанні значка шрыфта (нагрузак распаўсюджаных тут )
дададзена аўтар naththedeveloper, крыніца
праверыць некаторыя CSS «Фільтры» - Вы можаце быць у стане выкарыстаць «Адценне-паварот» ...
дададзена аўтар Weston Watson, крыніца
праверыць некаторыя CSS «Фільтры» - Вы можаце быць у стане выкарыстаць «Адценне-паварот» ...
дададзена аўтар Weston Watson, крыніца
праверыць некаторыя CSS «Фільтры» - Вы можаце быць у стане выкарыстаць «Адценне-паварот» ...
дададзена аўтар Weston Watson, крыніца

11 адказы

Вы можаце проста выразаць чорныя часткі ў фотошопе і зрабіць іх празрыстымі, то вы можаце ўжыць фон да выявы, як гэта:


Яна працуе на ўсіх браўзэрах.

1
дададзена
@AlessandroMinoccheri аб цяпер я бачу ...
дададзена аўтар Louay Alakkad, крыніца
@AlessandroMinoccheri вы можаце выкарыстоўваць SVG замест PNG?
дададзена аўтар Louay Alakkad, крыніца
зрабіць шлях, і запоўніць яго з патрэбным колерам з дапамогай CSS. Пасля гэтага вы можаце змяніць колер у CSS дынамічна з дапамогай PHP ці нешта падобнае.
дададзена аўтар Louay Alakkad, крыніца
Вы будзеце працаваць з тэкстам замест бінарнага, што робіць яго лягчэй.
дададзена аўтар Louay Alakkad, крыніца
Вы не загружайце малюнка, вы малюеце яго. Яна мае патрэбу ў некаторай працы, каб атрымаць гэта зрабіць (намаляваць малюнак), але вось некаторая дапамогу w3schools.com/svg /svg_path.asp
дададзена аўтар Louay Alakkad, крыніца
вы проста стварыць <�шлях> , а затым змяніць запоўніць = «# 000» усе, што вы хочаце.
дададзена аўтар Louay Alakkad, крыніца
дададзена аўтар Louay Alakkad, крыніца
Вам проста трэба зрабіць дакладную стрэлку ў малюнку з шляхам. тут вы можаце знайсці тое, што d азначае: w3schools.com/svg/svg_path.asp
дададзена аўтар Louay Alakkad, крыніца
Вы таксама можаце выкарыстоўваць GUI інструменты, такія як Adobe Illustrator, каб зрабіць SVG
дададзена аўтар Louay Alakkad, крыніца
няма, вы можаце выкарыстоўваць PNG ў якасці кіраўніцтва і выкарыстоўваць інструмент Пяро, каб намаляваць дакладную форму, а затым выдаліць PNG, і гэта дасьць вам файл SVG гатовы да выкарыстання.
дададзена аўтар Louay Alakkad, крыніца
ці паспрабуйце знайсці «Інтэрнэт PNG ў SVG канвэртар». хоць я прапаную вам даведацца, як зрабіць SVG.
дададзена аўтар Louay Alakkad, крыніца
ды вы .....
дададзена аўтар Louay Alakkad, крыніца
вось самы лепшы спосаб зрабіць гэта (без ведання SVG) перайдзіце па гэтай спасылцы: svg-edit.googlecode.com/svn/branches/2.5.1/editor/… затым націсніце 8 (інструмент выяву) і паставіць адрас вашага малюнка. пасля гэтага выкарыстоўвайце інструмент шляху (націснуць 6) і намалюйце дакладную форму стрэлкі. вярнуцца да абярыце прыладу (націснуць 1) і абярыце аб'ект шляху вы проста намалявалі, і вы ўбачыце два поля ў верхняй частцы старонкі, X і Y, змяненне і 0. Затым абярыце файл (не шлях) і выдаліць яго. У левым верхнім куце вы знойдзеце кнопку «прагледзець зыходны код» націсніце на яго, і вы атрымаеце код SVG.
дададзена аўтар Louay Alakkad, крыніца
Акрамя таго, выкарыстанне зуму (унізе злева), каб намаляваць дакладную форму стрэлкі, калі гэта неабходна. І выдаліць мяжу з дапамогай інструмента ў ніжняй часткі.
дададзена аўтар Louay Alakkad, крыніца
Калі ласка :)
дададзена аўтар Louay Alakkad, крыніца
Я не магу, таму што ў мяне ёсць яшчэ адзін малюнак пад, мне патрэбен празрысты фон
дададзена аўтар Alessandro Minoccheri, крыніца
малюнак-над іншым малюнка, і я не хачу, каб фон пакрываюць малюнак, я не хачу бачыць фон
дададзена аўтар Alessandro Minoccheri, крыніца
Я магу, але як пасля я магу змяніць колер? Я павінен загрузіць малюнак з крыніцы, не важна пашырэнне, важным з'яўляецца тое, што фон з'яўляецца празрыстым і «змест» колер пераменлівы
дададзена аўтар Alessandro Minoccheri, крыніца
Вы можаце зрабіць прыклад у jsfiddle, таму што я не разумею, як выкарыстоўваць шлях для загрузкі Animage з URL
дададзена аўтар Alessandro Minoccheri, крыніца
але я не разумею, як змясціць малюнак у <�шлях> не ясна, зрабіць прыклад, калі ласка,
дададзена аўтар Alessandro Minoccheri, крыніца
дасканалым, але як знайсці гэта? d = "M100 0 L200 100 L100 200 Z" Я не разумею, гэта з шляху ... Вы можаце растлумачыць?
дададзена аўтар Alessandro Minoccheri, крыніца
таму што ў мяне ёсьць вобраз, я не павінен ствараць час выканання яго
дададзена аўтар Alessandro Minoccheri, крыніца
І з Illustrator, калі я загружаю PNG можа вярнуць мне гэты радок?
дададзена аўтар Alessandro Minoccheri, крыніца
Калі я ствараю SVG, я магу мець радок, якую вы паставілі ў шлях?
дададзена аўтар Alessandro Minoccheri, крыніца
з онлайн-канвэртар я атрымаць гэта: w3.org/2000/ SVG & Quot , шырыня = "250.000000pt" вышыня = "250.000000pt" Viewbox = "0 0 250,000000 250,000000" preserveAspectRatio = "xMidYMid сустракаюцца"> <�метададзеныя> Створана Potrace 1.11, напісаны Піцерам Selinger 2001-2013 </метададзеныя> <�г пераўтварэнні = "перавесці (0.000000,250.000000) шкала (0,100000, -,100000)" заліванне = "# 000000" ход = "NONE"> </г>, але не з'яўляецца .. ммм. ,
дададзена аўтар Alessandro Minoccheri, крыніца
Дзякуй за вашу дапамогу, +1 для пацыента і тлумачэнняў
дададзена аўтар Alessandro Minoccheri, крыніца

Вы можаце проста выразаць чорныя часткі ў фотошопе і зрабіць іх празрыстымі, то вы можаце ўжыць фон да выявы, як гэта:


Яна працуе на ўсіх браўзэрах.

1
дададзена
@AlessandroMinoccheri аб цяпер я бачу ...
дададзена аўтар Louay Alakkad, крыніца
@AlessandroMinoccheri вы можаце выкарыстоўваць SVG замест PNG?
дададзена аўтар Louay Alakkad, крыніца
зрабіць шлях, і запоўніць яго з патрэбным колерам з дапамогай CSS. Пасля гэтага вы можаце змяніць колер у CSS дынамічна з дапамогай PHP ці нешта падобнае.
дададзена аўтар Louay Alakkad, крыніца
Вы будзеце працаваць з тэкстам замест бінарнага, што робіць яго лягчэй.
дададзена аўтар Louay Alakkad, крыніца
Вы не загружайце малюнка, вы малюеце яго. Яна мае патрэбу ў некаторай працы, каб атрымаць гэта зрабіць (намаляваць малюнак), але вось некаторая дапамогу w3schools.com/svg /svg_path.asp
дададзена аўтар Louay Alakkad, крыніца
вы проста стварыць <�шлях> , а затым змяніць запоўніць = «# 000» усе, што вы хочаце.
дададзена аўтар Louay Alakkad, крыніца
дададзена аўтар Louay Alakkad, крыніца
Вам проста трэба зрабіць дакладную стрэлку ў малюнку з шляхам. тут вы можаце знайсці тое, што d азначае: w3schools.com/svg/svg_path.asp
дададзена аўтар Louay Alakkad, крыніца
Вы таксама можаце выкарыстоўваць GUI інструменты, такія як Adobe Illustrator, каб зрабіць SVG
дададзена аўтар Louay Alakkad, крыніца
няма, вы можаце выкарыстоўваць PNG ў якасці кіраўніцтва і выкарыстоўваць інструмент Пяро, каб намаляваць дакладную форму, а затым выдаліць PNG, і гэта дасьць вам файл SVG гатовы да выкарыстання.
дададзена аўтар Louay Alakkad, крыніца
ці паспрабуйце знайсці «Інтэрнэт PNG ў SVG канвэртар». хоць я прапаную вам даведацца, як зрабіць SVG.
дададзена аўтар Louay Alakkad, крыніца
ды вы .....
дададзена аўтар Louay Alakkad, крыніца
вось самы лепшы спосаб зрабіць гэта (без ведання SVG) перайдзіце па гэтай спасылцы: svg-edit.googlecode.com/svn/branches/2.5.1/editor/… затым націсніце 8 (інструмент выяву) і паставіць адрас вашага малюнка. пасля гэтага выкарыстоўвайце інструмент шляху (націснуць 6) і намалюйце дакладную форму стрэлкі. вярнуцца да абярыце прыладу (націснуць 1) і абярыце аб'ект шляху вы проста намалявалі, і вы ўбачыце два поля ў верхняй частцы старонкі, X і Y, змяненне і 0. Затым абярыце файл (не шлях) і выдаліць яго. У левым верхнім куце вы знойдзеце кнопку «прагледзець зыходны код» націсніце на яго, і вы атрымаеце код SVG.
дададзена аўтар Louay Alakkad, крыніца
Акрамя таго, выкарыстанне зуму (унізе злева), каб намаляваць дакладную форму стрэлкі, калі гэта неабходна. І выдаліць мяжу з дапамогай інструмента ў ніжняй часткі.
дададзена аўтар Louay Alakkad, крыніца
Калі ласка :)
дададзена аўтар Louay Alakkad, крыніца
Я не магу, таму што ў мяне ёсць яшчэ адзін малюнак пад, мне патрэбен празрысты фон
дададзена аўтар Alessandro Minoccheri, крыніца
малюнак-над іншым малюнка, і я не хачу, каб фон пакрываюць малюнак, я не хачу бачыць фон
дададзена аўтар Alessandro Minoccheri, крыніца
Я магу, але як пасля я магу змяніць колер? Я павінен загрузіць малюнак з крыніцы, не важна пашырэнне, важным з'яўляецца тое, што фон з'яўляецца празрыстым і «змест» колер пераменлівы
дададзена аўтар Alessandro Minoccheri, крыніца
Вы можаце зрабіць прыклад у jsfiddle, таму што я не разумею, як выкарыстоўваць шлях для загрузкі Animage з URL
дададзена аўтар Alessandro Minoccheri, крыніца
але я не разумею, як змясціць малюнак у <�шлях> не ясна, зрабіць прыклад, калі ласка,
дададзена аўтар Alessandro Minoccheri, крыніца
дасканалым, але як знайсці гэта? d = "M100 0 L200 100 L100 200 Z" Я не разумею, гэта з шляху ... Вы можаце растлумачыць?
дададзена аўтар Alessandro Minoccheri, крыніца
таму што ў мяне ёсьць вобраз, я не павінен ствараць час выканання яго
дададзена аўтар Alessandro Minoccheri, крыніца
І з Illustrator, калі я загружаю PNG можа вярнуць мне гэты радок?
дададзена аўтар Alessandro Minoccheri, крыніца
Калі я ствараю SVG, я магу мець радок, якую вы паставілі ў шлях?
дададзена аўтар Alessandro Minoccheri, крыніца
з онлайн-канвэртар я атрымаць гэта: w3.org/2000/ SVG & Quot , шырыня = "250.000000pt" вышыня = "250.000000pt" Viewbox = "0 0 250,000000 250,000000" preserveAspectRatio = "xMidYMid сустракаюцца"> <�метададзеныя> Створана Potrace 1.11, напісаны Піцерам Selinger 2001-2013 </метададзеныя> <�г пераўтварэнні = "перавесці (0.000000,250.000000) шкала (0,100000, -,100000)" заліванне = "# 000000" ход = "NONE"> </г>, але не з'яўляецца .. ммм. ,
дададзена аўтар Alessandro Minoccheri, крыніца
Дзякуй за вашу дапамогу, +1 для пацыента і тлумачэнняў
дададзена аўтар Alessandro Minoccheri, крыніца

Вы можаце проста выразаць чорныя часткі ў фотошопе і зрабіць іх празрыстымі, то вы можаце ўжыць фон да выявы, як гэта:


Яна працуе на ўсіх браўзэрах.

1
дададзена
@AlessandroMinoccheri аб цяпер я бачу ...
дададзена аўтар Louay Alakkad, крыніца
@AlessandroMinoccheri вы можаце выкарыстоўваць SVG замест PNG?
дададзена аўтар Louay Alakkad, крыніца
зрабіць шлях, і запоўніць яго з патрэбным колерам з дапамогай CSS. Пасля гэтага вы можаце змяніць колер у CSS дынамічна з дапамогай PHP ці нешта падобнае.
дададзена аўтар Louay Alakkad, крыніца
Вы будзеце працаваць з тэкстам замест бінарнага, што робіць яго лягчэй.
дададзена аўтар Louay Alakkad, крыніца
Вы не загружайце малюнка, вы малюеце яго. Яна мае патрэбу ў некаторай працы, каб атрымаць гэта зрабіць (намаляваць малюнак), але вось некаторая дапамогу w3schools.com/svg /svg_path.asp
дададзена аўтар Louay Alakkad, крыніца
вы проста стварыць <�шлях> , а затым змяніць запоўніць = «# 000» усе, што вы хочаце.
дададзена аўтар Louay Alakkad, крыніца
дададзена аўтар Louay Alakkad, крыніца
Вам проста трэба зрабіць дакладную стрэлку ў малюнку з шляхам. тут вы можаце знайсці тое, што d азначае: w3schools.com/svg/svg_path.asp
дададзена аўтар Louay Alakkad, крыніца
Вы таксама можаце выкарыстоўваць GUI інструменты, такія як Adobe Illustrator, каб зрабіць SVG
дададзена аўтар Louay Alakkad, крыніца
няма, вы можаце выкарыстоўваць PNG ў якасці кіраўніцтва і выкарыстоўваць інструмент Пяро, каб намаляваць дакладную форму, а затым выдаліць PNG, і гэта дасьць вам файл SVG гатовы да выкарыстання.
дададзена аўтар Louay Alakkad, крыніца
ці паспрабуйце знайсці «Інтэрнэт PNG ў SVG канвэртар». хоць я прапаную вам даведацца, як зрабіць SVG.
дададзена аўтар Louay Alakkad, крыніца
ды вы .....
дададзена аўтар Louay Alakkad, крыніца
вось самы лепшы спосаб зрабіць гэта (без ведання SVG) перайдзіце па гэтай спасылцы: svg-edit.googlecode.com/svn/branches/2.5.1/editor/… затым націсніце 8 (інструмент выяву) і паставіць адрас вашага малюнка. пасля гэтага выкарыстоўвайце інструмент шляху (націснуць 6) і намалюйце дакладную форму стрэлкі. вярнуцца да абярыце прыладу (націснуць 1) і абярыце аб'ект шляху вы проста намалявалі, і вы ўбачыце два поля ў верхняй частцы старонкі, X і Y, змяненне і 0. Затым абярыце файл (не шлях) і выдаліць яго. У левым верхнім куце вы знойдзеце кнопку «прагледзець зыходны код» націсніце на яго, і вы атрымаеце код SVG.
дададзена аўтар Louay Alakkad, крыніца
Акрамя таго, выкарыстанне зуму (унізе злева), каб намаляваць дакладную форму стрэлкі, калі гэта неабходна. І выдаліць мяжу з дапамогай інструмента ў ніжняй часткі.
дададзена аўтар Louay Alakkad, крыніца
Калі ласка :)
дададзена аўтар Louay Alakkad, крыніца
Я не магу, таму што ў мяне ёсць яшчэ адзін малюнак пад, мне патрэбен празрысты фон
дададзена аўтар Alessandro Minoccheri, крыніца
малюнак-над іншым малюнка, і я не хачу, каб фон пакрываюць малюнак, я не хачу бачыць фон
дададзена аўтар Alessandro Minoccheri, крыніца
Я магу, але як пасля я магу змяніць колер? Я павінен загрузіць малюнак з крыніцы, не важна пашырэнне, важным з'яўляецца тое, што фон з'яўляецца празрыстым і «змест» колер пераменлівы
дададзена аўтар Alessandro Minoccheri, крыніца
Вы можаце зрабіць прыклад у jsfiddle, таму што я не разумею, як выкарыстоўваць шлях для загрузкі Animage з URL
дададзена аўтар Alessandro Minoccheri, крыніца
але я не разумею, як змясціць малюнак у <�шлях> не ясна, зрабіць прыклад, калі ласка,
дададзена аўтар Alessandro Minoccheri, крыніца
дасканалым, але як знайсці гэта? d = "M100 0 L200 100 L100 200 Z" Я не разумею, гэта з шляху ... Вы можаце растлумачыць?
дададзена аўтар Alessandro Minoccheri, крыніца
таму што ў мяне ёсьць вобраз, я не павінен ствараць час выканання яго
дададзена аўтар Alessandro Minoccheri, крыніца
І з Illustrator, калі я загружаю PNG можа вярнуць мне гэты радок?
дададзена аўтар Alessandro Minoccheri, крыніца
Калі я ствараю SVG, я магу мець радок, якую вы паставілі ў шлях?
дададзена аўтар Alessandro Minoccheri, крыніца
з онлайн-канвэртар я атрымаць гэта: w3.org/2000/ SVG & Quot , шырыня = "250.000000pt" вышыня = "250.000000pt" Viewbox = "0 0 250,000000 250,000000" preserveAspectRatio = "xMidYMid сустракаюцца"> <�метададзеныя> Створана Potrace 1.11, напісаны Піцерам Selinger 2001-2013 </метададзеныя> <�г пераўтварэнні = "перавесці (0.000000,250.000000) шкала (0,100000, -,100000)" заліванне = "# 000000" ход = "NONE"> </г>, але не з'яўляецца .. ммм. ,
дададзена аўтар Alessandro Minoccheri, крыніца
Дзякуй за вашу дапамогу, +1 для пацыента і тлумачэнняў
дададзена аўтар Alessandro Minoccheri, крыніца

Я разумею, што гэтае пытанне не быў пазначаны з CSS3, але і для тых, хто лічыць гэта карысным, або хто проста не ведаюць, што можна выкарыстоўваць -mask-каробкавай выявы ў спалучэнні з фон < /> код, каб «маска» малюнкі з цвёрдымі кветкамі, іншымі малюнкамі, ці нават [як паказана ў прыкладзе] з градыенты . Улічваючы programatic даступнасці, гэта можа быць зменена на лета з мінімальнымі сцэнарамі, пры жаданні.

нацэнка

<div class="arrow"></div>

CSS

.arrow {
     width: 250px;
     height: 250px;
     -webkit-mask-box-image: url('http://i.stack.imgur.com/1jkhG.png');
     background: -webkit-gradient(linear, 38% 0%, 60% 70%, from(#dde9f0), to(#3fc5f8), color-stop(.6,#79b2ec),color-stop(.7,#2e91e5));
}

вынік

вынік

шлёпнуць

http://plnkr.co/edit/717iDTzblDQfFSkaT2N6?p=preview

Відавочна, што гэта вельмі важна, каб быць у курсе пастаўшчыка прэфікса і падтрымоўваныя асяроддзя.

1
дададзена
не працуе ў Firefox, і я не думаю, што ў IE працуе ... але ў Chrome працуе выдатна ... але мне трэба рашэнне для ўсіх браўзэра можна?
дададзена аўтар Alessandro Minoccheri, крыніца
было б добрым рашэннем, калі WebKit быў не толькі адзін які падтрымлівае гэты ... Так што практычна непрыдатным для выкарыстання, па меншай меры на працягу наступных 2-х гадоў.
дададзена аўтар Christoph, крыніца
Калі вам патрэбен запасны варыянт для SVG 50% браўзэраў, проста <�я> выкарыстоўваць Г у першую чаргу.
дададзена аўтар Christoph, крыніца
@Christoph, я не згодны. Хоць, «практычна непрыдатныя для выкарыстання» носіць суб'ектыўны характар. OP, вось добра чытаць на рашэнне крос-браўзэра, які выкарыстоўвае метад вышэй і SVG-запасны варыянт у іншым месцы: HTTP: //thenittygritty.co/css-masking
дададзена аўтар couzzi, крыніца
Кірмаш кропка, @Christoph. Падобна на тое, у вас ёсць больш чым дастаткова рэпутацыі, каб адправіць адказ; чаму б не даць гэтаму ісці?
дададзена аўтар couzzi, крыніца

Я разумею, што гэтае пытанне не быў пазначаны з CSS3, але і для тых, хто лічыць гэта карысным, або хто проста не ведаюць, што можна выкарыстоўваць -mask-каробкавай выявы ў спалучэнні з фон < /> код, каб «маска» малюнкі з цвёрдымі кветкамі, іншымі малюнкамі, ці нават [як паказана ў прыкладзе] з градыенты . Улічваючы programatic даступнасці, гэта можа быць зменена на лета з мінімальнымі сцэнарамі, пры жаданні.

нацэнка

<div class="arrow"></div>

CSS

.arrow {
     width: 250px;
     height: 250px;
     -webkit-mask-box-image: url('http://i.stack.imgur.com/1jkhG.png');
     background: -webkit-gradient(linear, 38% 0%, 60% 70%, from(#dde9f0), to(#3fc5f8), color-stop(.6,#79b2ec),color-stop(.7,#2e91e5));
}

вынік

вынік

шлёпнуць

http://plnkr.co/edit/717iDTzblDQfFSkaT2N6?p=preview

Відавочна, што гэта вельмі важна, каб быць у курсе пастаўшчыка прэфікса і падтрымоўваныя асяроддзя.

1
дададзена
не працуе ў Firefox, і я не думаю, што ў IE працуе ... але ў Chrome працуе выдатна ... але мне трэба рашэнне для ўсіх браўзэра можна?
дададзена аўтар Alessandro Minoccheri, крыніца
было б добрым рашэннем, калі WebKit быў не толькі адзін які падтрымлівае гэты ... Так што практычна непрыдатным для выкарыстання, па меншай меры на працягу наступных 2-х гадоў.
дададзена аўтар Christoph, крыніца
Калі вам патрэбен запасны варыянт для SVG 50% браўзэраў, проста <�я> выкарыстоўваць Г у першую чаргу.
дададзена аўтар Christoph, крыніца
@Christoph, я не згодны. Хоць, «практычна непрыдатныя для выкарыстання» носіць суб'ектыўны характар. OP, вось добра чытаць на рашэнне крос-браўзэра, які выкарыстоўвае метад вышэй і SVG-запасны варыянт у іншым месцы: HTTP: //thenittygritty.co/css-masking
дададзена аўтар couzzi, крыніца
Кірмаш кропка, @Christoph. Падобна на тое, у вас ёсць больш чым дастаткова рэпутацыі, каб адправіць адказ; чаму б не даць гэтаму ісці?
дададзена аўтар couzzi, крыніца

Я разумею, што гэтае пытанне не быў пазначаны з CSS3, але і для тых, хто лічыць гэта карысным, або хто проста не ведаюць, што можна выкарыстоўваць -mask-каробкавай выявы ў спалучэнні з фон < /> код, каб «маска» малюнкі з цвёрдымі кветкамі, іншымі малюнкамі, ці нават [як паказана ў прыкладзе] з градыенты . Улічваючы programatic даступнасці, гэта можа быць зменена на лета з мінімальнымі сцэнарамі, пры жаданні.

нацэнка

<div class="arrow"></div>

CSS

.arrow {
     width: 250px;
     height: 250px;
     -webkit-mask-box-image: url('http://i.stack.imgur.com/1jkhG.png');
     background: -webkit-gradient(linear, 38% 0%, 60% 70%, from(#dde9f0), to(#3fc5f8), color-stop(.6,#79b2ec),color-stop(.7,#2e91e5));
}

вынік

вынік

шлёпнуць

http://plnkr.co/edit/717iDTzblDQfFSkaT2N6?p=preview

Відавочна, што гэта вельмі важна, каб быць у курсе пастаўшчыка прэфікса і падтрымоўваныя асяроддзя.

1
дададзена
не працуе ў Firefox, і я не думаю, што ў IE працуе ... але ў Chrome працуе выдатна ... але мне трэба рашэнне для ўсіх браўзэра можна?
дададзена аўтар Alessandro Minoccheri, крыніца
было б добрым рашэннем, калі WebKit быў не толькі адзін які падтрымлівае гэты ... Так што практычна непрыдатным для выкарыстання, па меншай меры на працягу наступных 2-х гадоў.
дададзена аўтар Christoph, крыніца
Калі вам патрэбен запасны варыянт для SVG 50% браўзэраў, проста <�я> выкарыстоўваць Г у першую чаргу.
дададзена аўтар Christoph, крыніца
@Christoph, я не згодны. Хоць, «практычна непрыдатныя для выкарыстання» носіць суб'ектыўны характар. OP, вось добра чытаць на рашэнне крос-браўзэра, які выкарыстоўвае метад вышэй і SVG-запасны варыянт у іншым месцы: HTTP: //thenittygritty.co/css-masking
дададзена аўтар couzzi, крыніца
Кірмаш кропка, @Christoph. Падобна на тое, у вас ёсць больш чым дастаткова рэпутацыі, каб адправіць адказ; чаму б не даць гэтаму ісці?
дададзена аўтар couzzi, крыніца

Як і іншыя прапанавалі вы можаце таксама проста выкарыстоўваць SVG

 
 

Вы можаце выбраць элемент з ідэнтыфікатарам і змяніць заліванне (або выкарыстоўваць стыль = "заліванне: # 000000").

1
дададзена

Як і іншыя прапанавалі вы можаце таксама проста выкарыстоўваць SVG

 
 

Вы можаце выбраць элемент з ідэнтыфікатарам і змяніць заліванне (або выкарыстоўваць стыль = "заліванне: # 000000").

1
дададзена

Вы не можаце зрабіць гэта на лета. Напрыклад, вы можаце стварыць гэты файл з дапамогай PHP скрыпту і захаваць яго для кожнага колеру. Вы можаце зрабіць гэта ў лакальным кампутары і загрузіць 100 малюнкаў на сервер. Ці вы можаце стварыць яго на сэрвэры і выкарыстоўваць «пастаянны» кэш. Напрыклад, выкарыстанне лініі arrow.php? Колер = 000000

Сцэнар будзе правяраць ў файле з імем тэчкі 000000.png і калі файл існуе, то перадаць яго ў браўзэр. Інакш скрыпт створыць новы файл з гэтым колерам, захавайце яго ў файл 000000.png і перадаць яго ў браўзэр.

0
дададзена

Вы не можаце зрабіць гэта на лета. Напрыклад, вы можаце стварыць гэты файл з дапамогай PHP скрыпту і захаваць яго для кожнага колеру. Вы можаце зрабіць гэта ў лакальным кампутары і загрузіць 100 малюнкаў на сервер. Ці вы можаце стварыць яго на сэрвэры і выкарыстоўваць «пастаянны» кэш. Напрыклад, выкарыстанне лініі arrow.php? Колер = 000000

Сцэнар будзе правяраць ў файле з імем тэчкі 000000.png і калі файл існуе, то перадаць яго ў браўзэр. Інакш скрыпт створыць новы файл з гэтым колерам, захавайце яго ў файл 000000.png і перадаць яго ў браўзэр.

0
дададзена

Вы не можаце зрабіць гэта на лета. Напрыклад, вы можаце стварыць гэты файл з дапамогай PHP скрыпту і захаваць яго для кожнага колеру. Вы можаце зрабіць гэта ў лакальным кампутары і загрузіць 100 малюнкаў на сервер. Ці вы можаце стварыць яго на сэрвэры і выкарыстоўваць «пастаянны» кэш. Напрыклад, выкарыстанне лініі arrow.php? Колер = 000000

Сцэнар будзе правяраць ў файле з імем тэчкі 000000.png і калі файл існуе, то перадаць яго ў браўзэр. Інакш скрыпт створыць новы файл з гэтым колерам, захавайце яго ў файл 000000.png і перадаць яго ў браўзэр.

0
дададзена