+ 2

J.S | CSS Still working on this image editor - help -

Now I have multiple filters, somehow different functions (inputs) are controlling other filters. Like... a is supposed to control a, but it's controlling b too. I'm not sure if the filters have to be in certain or what, but they're out of place. You'l see what i mean when you open the code. Can someone help me tell each different function (input) to control they're own filters.? https://code.sololearn.com/Wep8Iw2ZgCiF/?ref=app

28th Jun 2019, 3:26 AM
Ginfio
Ginfio - avatar
14 Réponses
+ 2
what i can see is you putting too much value in the filter range normally use percent from 0% to 100% or using if not using percent ranging from 0 to 1, where 0 is 0% and 1 is 100%. inyour case, for example the saturation is up to 200. that means if 1 is 100% and 100% is normal state of the image, putting 200 will result in 20000% saturation. also you need to put a correct initial value for the filter, this is what cause the image turn grayscale in the first time you turn the slider. because initial value of the saturation is 0. try to change it to 1 or 100% as default value.
28th Jun 2019, 4:06 AM
Taste
Taste - avatar
+ 3
Taste I don't understand why the brightness is controlling grayscale and brightness both, And also why grayscale isn't working. --
28th Jun 2019, 4:13 AM
Ginfio
Ginfio - avatar
+ 3
Taste , they all have 100% max . But, they're controlling different filters. Like...grayscale is controling saturate until it gets to 100%. Same thing for brightness - its controlling something different. --
28th Jun 2019, 4:24 AM
Ginfio
Ginfio - avatar
+ 3
Taste Should it be A, "saturate("+str.value+"%)" or B, "saturate("+str.value+"%"+")" A or B?
28th Jun 2019, 4:44 AM
Ginfio
Ginfio - avatar
+ 3
Taste 🤔🤔🙄 I don't know if it's because of the percentages or what, now it turned out into this: https://code.sololearn.com/Wep8Iw2ZgCiF/?ref=app --
28th Jun 2019, 4:49 AM
Ginfio
Ginfio - avatar
+ 2
its just looks like its controlling the other. the initial value of saturation (in your slider) is 100, that means when the event is fired it'll take that value. and as i said before 100 without % means 10000%. try to add a percent in the filter string in js. forexample "saturate("+str.value+"%)" also apply this in the other filter function
28th Jun 2019, 4:32 AM
Taste
Taste - avatar
+ 2
Taste u right 💡. Anything working?; Brightness ✔️; Any problems?: - Saturate + Grayscale make the image darker when i first press on the input. - grayscale does work. the problem is it makes the picture darker when i first press on it. I think its the saturate that isn't working. 1, it makes the image darker. 2, it seems to be controling grayscale (when i move to the left.)
28th Jun 2019, 5:01 AM
Ginfio
Ginfio - avatar
+ 2
Taste , image darkening on black: fixed✔️ btw - i put the value of brightness to 200. So 100 is 50%. So we have the option to make it brighter or darker. because if it's set to 100, we only have z option to make it darker. -- and it doesn't seem to be causing any trouble. Anyways __ Now is saturate supposed to turn the image to black and white (grayscale) when its moved to left? Because that's what it's doing. If that isn't normal, that's what im trying to fix. //Stop it from controlong grayscale. --
28th Jun 2019, 5:21 AM
Ginfio
Ginfio - avatar
+ 2
Taste , nvr mind. Ya. Saturate is supposed to make it kinda grayscale when moved to the left (0). Anything working?:ALL ✅; Anything need to fix: not for now; ✔️✔️✔️ Thank You Taste. Everything is working now.😄
28th Jun 2019, 5:30 AM
Ginfio
Ginfio - avatar
+ 2
sorry, i forgot to reply. good to know all the problem are solved :)
28th Jun 2019, 5:32 AM
Taste
Taste - avatar
+ 1
nope, its all working fine. other than the "too much value" problem i mentioned above
28th Jun 2019, 4:19 AM
Taste
Taste - avatar
+ 1
its basicly the same "%" + ")" = "%)"
28th Jun 2019, 4:45 AM
Taste
Taste - avatar
+ 1
if the value of brightness is 100. then in your code brightness is divided by 25. then whats the actual value for brightness ?
28th Jun 2019, 4:52 AM
Taste
Taste - avatar
+ 1
the image is darker because the initial valie of brightness is at 50% put it at 100%
28th Jun 2019, 5:10 AM
Taste
Taste - avatar