Grow your CSS skills. Land your dream job.

How to Crop image white space automatically using jQuery?

  • # May 21, 2013 at 9:31 am

    How to Crop image white space automatically using jQuery?

    # May 21, 2013 at 9:48 am

    What is ‘image white space’?

    # May 21, 2013 at 11:35 am

    I imagine leading and trailing rows and columns with just white pixels.

    You can’t with jQuery, you can with the canvas API.

    Draw image to canvas, get image data from canvas, iterate over the pixels removing leading and trailing rows and columns and then put the image data back on the canvas.

    This might help you to get started: http://www.html5canvastutorials.com/advanced/html5-canvas-get-image-data-tutorial/ it has all the bits you need.

    # May 21, 2013 at 11:46 am

    >I imagine **leading and trailing rows and columns with just white pixels**

    I have no idea what that means. How does an image have those…where are they coming from?

    Does it work for “blue space”?

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".