0

I have got a div in HTML where user can filter an image 

<div class='FilterHere'>
       <img src='../users/s.png' class="ImgtoFi">
    <div class="FilterRange"></div>
      <div class="Filters">
          <div class="Grayscale">
             <img src='../users/s.png' class="ImgtoFi">
          </div>
      </div>

and i have also got this jquery 

$(".Grayscale").click(function() {
                $(".FilterRange").append('<div><input type="range" class="Ranger"></div>')

            $(".Ranger").change(function() {
                var p=$(this).val(); 
                $(".ImgtoFi").css('filter', 'grayscale('+p+'%)');
                $(".ImgtoFi").css('-webkit-filter', 'grayscale('+p+'%)');
            });

So after user editing his image how can i save new filtered image?

Tom Odell
  • 41
  • 9
  • _NO_, You can not.. Quiet funny solution would be to take screen shot of the webpage and crop the target area.. – Rayon Jun 09 '16 at 08:04
  • @Rayon How can i do that? – Tom Odell Jun 09 '16 at 08:06
  • Poor duplicate. This one is better: http://stackoverflow.com/questions/15669221/save-images-after-using-css-filter – mplungjan Jun 09 '16 at 08:12
  • @mplungjan the duplicate was the same question the OP asked already several hours ago – Rory McCrossan Jun 09 '16 at 08:13
  • But could not get an answer @RoryMcCrossan – Tom Odell Jun 09 '16 at 08:16
  • You've had two answers - both that this isn't possible. [The link](http://stackoverflow.com/questions/15669221/save-images-after-using-css-filter) that @mplungjan posted is the closest solution for you, but generating an output image that contains the output of CSS filters isn't possible. – Rory McCrossan Jun 09 '16 at 08:19
  • I tried that but it gives me an error Uncaught TypeError: Cannot read property 'getContext' of null – Tom Odell Jun 09 '16 at 08:24

0 Answers0