0

So i have got div where user can filter his image HTML

  <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>

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 it all works perfectly.But after user applied some filters how do i save new edited image?

Tom Odell
  • 41
  • 9
  • You can't. The only way to save a rendered image is by creating it in SVG and but even then, CSS filters wouldn't apply to the output image you would need to calculate them manually, see [this question](http://stackoverflow.com/questions/30408939/how-to-save-image-from-canvas-with-css-filters) for more info – Rory McCrossan Jun 08 '16 at 20:39
  • I hope these topis help you : http://stackoverflow.com/questions/19183180/how-to-save-an-image-to-localstorage-and-display-it-on-the-next-page http://stackoverflow.com/questions/19158887/saving-and-loading-an-image-from-localstorage – Yuri Pereira Jun 08 '16 at 20:40
  • @YuriRamos i don't want to save it on localstorage i want to save it on computer – Tom Odell Jun 08 '16 at 20:46

0 Answers0