Automatically zoom and crop an image to fit in a square

I've got an mx:Image which is loading an image from the web.  I don't know how big the image will be in advance.  I'd like the loaded image to fit within the mx:Image's square frame by zooming and cropping off the sides or top/bottom as needed.  In other words, if the image frame is 64x64 and the loaded image is 70x64, it will be centered and lose a few pixels on the right and left sides.  Is it possible to do automatically?  I've played with maintainAspectRatio and scaleContent but I haven't been able to get what I want.

In an ideal world we would use a high resolution version with a 100% width set for every device (and screen size). Because of bandwidth reasons, the page should load only a version of the image intended for a specific width range.
Sometime in the future we will (probably) be able to use this:
<picture width="500" height="500">
   <source media="(min-width: 45em)" src="large.jpg">
   <source media="(min-width: 18em)" src="med.jpg">
   <source src="small.jpg">
   <img src="small.jpg" alt="">
   <p>Accessible text</p>
</picture>
However, this will not yet work. Therefore, ideally, a polyfill picturefill method that works quite well can alternatively be used:
https://github.com/scottjehl/picturefill
Solution:
Call the picturefill.js (see above url for more information and sample code)
body:
<span data-picture data-alt="A giant stone face at The Bayon temple in Angkor Thom, Cambodia">
        <span data-src="small.jpg"></span>
        <span data-src="medium.jpg"     data-media="(min-width: 400px)"></span>
        <span data-src="large.jpg"      data-media="(min-width: 800px)"></span>
        <span data-src="extralarge.jpg" data-media="(min-width: 1000px)"></span>
        <!-- Fallback content for non-JS browsers. Same img src as the initial, unqualified source element. -->
        <noscript>
            <img src="external/imgs/small.jpg" alt="A giant stone face at The Bayon temple in Angkor Thom, Cambodia">
        </noscript>
    </span>
This works in all browsers and devices. On a mobile platform only the lower resolution image will be loaded up.

Similar Messages

  • Scale and Crop with Image Alchemy

    Hello,
    We're using Digital Asset Managment with Image Alchemy for the conversion engine. Does anybody know how to configure a rendition set that scales and crops an image without distortion? So if you check-in a 1000x1500 pixel jpeg, it could scale it down and crop it to exactly 100x100 pixels.
    I've been looking through the Image Alchemy documentation, but haven't found this example yet.
    Thanks
    -Jason

    All you need to do is define an "ImageAlchemy" variable inside the "ImageManager_NameValues" ResultSet, DAM automatically knows when to use it for the rendition info. But instead of pointing to the ImageAlchemy executable file, I point to my script. For my conversion ResultSet's extEngine, I refer to an "ImageMagick" variable instead.

  • I have 4 equal oblong shape created with borders How do I go about knowing what size the selection area is so that I can crop an image to fit. I don't want to use paste in then adjust the bounding box to suit

    I have 4 equal oblong shape created with borders How do I go about knowing what size the selection area is so that I can crop an image to fit. I don't want to use paste in then adjust the bounding box to suit

    What do you mean a moderator

  • My ipod seems to have automatically zoomed and will not unzoom, any ideas?

    my ipod seems to have automatically zoomed and will not unzoom?  I am looking for a way to hopefully reset?  thank you.

    For more information see:
    iPhone and iPod touch: Home screen icons are magnified or large

  • The video is automatically zoomed in (cropped)

    during the video calls if the other person is using and android phone in lanscape mode the received video will be extremely zoomed in and showing only just a part of what should appear and in the full screen mode if I moved the mouse cursor to the very right or left edges it will start to show some other hidden part of the video !!! zoomed in is a good feature but not to be automatically zoomed in I believe that it is a bug not a feature when it is done without the permission of the user .. who wants to see a small part of the receved video ?!!!

    This happens for me too. The result: I can just about see someone's full face when they're exactly in the center. Previously, I could make a pinch gesture with my fingers in order to zoom out the picture. But this has stopped working since a few weeks ago. I've tried rebooting the device and that didn't resolve anything, so I'm thinking that something changed in the software that made it break.

  • Rotating and cropping an image.

    I am taking a Photoshop for school and we are using CS5. I have CS6 and I'm stuck on my picture rotating back straight when I am trying to crop it.  I use the rotate view and rotate it 6degrees. As soon as I hit the crop button the picture goes straight. How can I keep my picture rotated to the 6degrees and crop it without the perspective crop tool?

    Rotate view only rotates...  the view; not the actual picture.  It's temporary and non-destructive. It's used to help move the canvas to a better angle for drawing brush strokes.
    You want to actually rotate the image or canvas.  Either Ctrl T for Free Transform and rotate by moving the cursor outside one of the corners and dragging.  Or Edit > Transform > Rotate

  • Feature Request: Scan attached drives to automatically find and reconnect "missing" images

    This is the kind of thing that computers are good for. I'm surprised that we've made it all the way to version 5 without this feature being added.  It would be relatively easy.
    Scan the catalog to make an internal list of all images that are "missing" (the raw file is not found where the catalog says it should be).
    Scan the attached hard drives and make an internal list of all images on the system.
    Compare the file names, sizes and dates of all of the found images and match them up. 
    You could provide a UI to confirm the reconnected images, or simply do it automatically.  If desired, you could use EXIF data in the images to help confirm that the proper images are being connected.  In fact, this step could be used as an "advanced" option to find images where the filename has changed.
    Thanks for your consideration!
    David Terry
    (an original Raw Shooter and RawShooter/Pro user - which Adobe purchased and turned into Lightroom 1.0 - it's been a wonderful ride so far!)

    Eliminating step 2 eliminates the security of an immediate backup.  I don't want to ever tell a customer that I lost their images.  The backup is done just as soon as possible.
    Doing the processing on the SSD while having backed up to storage lets me get through thousands of images on a weekly basis (all things related to weddings as well as family portraits, seniors and the like). 
    The syncing process is automated (in fact, most of my processes are).  It keeps *me* fast and efficient. 
    So why argue against a tool that can benefit not only me but others that have lost their images (for reasons having nothing to do with me or my workflow)?  I am involved in many forums and have frequently helped people to find their lost images.  I love that Lightroom easily reconnects the images.  The only hard part is finding what happened to them (often they did a bonehead drag and drop of a folder and moved the images somewhere they didn't expect, sometimes they changed drive letters, sometimes they purposely move files and just don't realize the repercussions). 
    ALL of these people would benefit from adding this feature.
    Why try to argue against it?  I don't need a solution to my workflow.  I love my workflow.  I just think this feature would be beneficial to me and lots of other people.
    Thanks for understanding.

  • Zoom and Pan of image

    My objective is to be able to zoom in on an image and be able
    to pan the image around within my stage.
    Is there any tutorials that anyone knows of.
    Thanks for your time

    You can use ActionScript to create a mouse event to your
    image (convert it to a movie clip) and when the user clicks on the
    image, he can make the image bigger or smaller. It's not a real
    zooming in but if the image gets bigger you do see more.
    Is that what you are trying to achieve?

  • Iphoto - Zoom and crop question.

    I have seem this question asked but I am still unable to execute this process.
    I zoomed on a photo on iphoto to send via email and when I went to crop it (as in save the zoom for that photo), it always reverted back to the original size.
    Help would be greatly appreciated.
    Alan.

    Sorry I don't think I explained properly.
    I just want to zoom into a picture of two faces in the photo, close up and then send it.
    I have tried numerous times with no success.
    Thanks
    Alan.

  • I photo "zoom"  and "crop" function

    Maybe I'm missing something but I'm unable (when in edit photo) to zoom in on a photo and then try to crop to that particular area. Every time I hit crop the picture reverts back to the original size. I was always able to this with ease in prior versions. Help please! Thanks

    Welcome to the Apple Discussions.
    Start with this basic fix: trash the com.apple.iPhoto.plist file from the HD/Users/ Your Name / library / preferences folder. (Remember you'll need to reset your User options afterwards. These include minor settings like the window colour and so on. Note: If you've moved your library you'll need to point iPhoto at it again.)
    *What's the plist file?*
    For new users: Every application on your Mac has an accompanying plist file. It records certain User choices. For instance, in your favourite Word Processor it remembers your choice of Default Font, on your Web Browser is remembers things like your choice of Home Page. It even recalls what windows you had open last if your app allows you to pick up from where you left off last. The iPhoto plist file remembers things like the location of the Library, your choice of background colour, whether you are running a Referenced or Managed Library, what preferences you have for autosplitting events and so on. Trashing the plist file forces the app to generate a new one on the next launch, and this restores things to the Factory Defaults. Hence, if you've changed any of these things you'll need to reset them. If you haven't, then no bother. Trashing the plist file is Mac troubleshooting 101.
    Regards
    TD

  • Correcting and cropping scanned images as a batch

    I am working on a project involving about 20,000 scans from historic journals. We are trying to create replicas, since the originals have not been preserved.
    The scans have already been completed and my job is to figure out how to get the actual block of text, which is about 4.3"x7.3", to be centered, both horizontally and vertically. Then the pages will be printed and trimmed down to the 6x9 page. The scan job wasn't extremely precise, since the margins aren't uniform.
    I'm wondering if you have any ideas about how to do this job in a batch fashion. The files are in TIF format.
    I appreciate any suggestions/advice.
    Sincerely,
    Tricia Dameron

    Looks like you're not getting much feedback on this challenge....
    If it was mine, and I was the person actually doing it,  I would optimistically quote about 80 hours to place and align manually, one by one.  Pity the scanners weren't thinking ahead!
    The reason I say I estimate on my own rate is that you could give this task to several different people and get very different ideas of how to do it and if you assign to the wrong operator you will end up well out of pocket.
    Some tasks just can't be automated, maybe someone really clever can do it with your job but probably not economical, I would just sit down for a fortnight and do it!

  • Replacing and retaining scaled and cropped images

    Hi,
    For some reason I can't find how to replace exisisting images that had been tweeked or even images that have not been tweeked in Author. I have several similar images that needs to be scaled and postion in the same area from page to page. I import an image, scale it and cropped it, but once placed I don't know how to replace it with a different image. I tried creating a a template (another problem), but still no go.
    *also, is there a way to create a job without using template? It doesn't seem to allow you it.
    Thanks in advance...AG_779

    You can have a master image on the right hand page in the layout pane,
    and set it to be a media placeholder.(in inspector)
    The image will be same size same spot on each page,
    You can drag an drop to replace the image on each page.
    The problem is, if the new image is a different size (pixels), it will change the size of the place holder frame to match the new image. it will not keep the size of the master image and crop with in that size.
    It is best if you scale and crop each image outside of IBA in Photoshop etc. first,
    then drag and drop on the place hlder for each page.

  • Premier Elements 12 zoom vs crop

    On some clips the default pan and zoom tool does a pan and zoom, but on other clips it does a crop and pan (without me changing anything).  I don't want the crop... I want it tpo zoom and pan all the time for this project.  I've right clicked everywhere I can think of and don't come up with a settings menu.  Is there a settings menu other than via the Applied Effect toggle (which doesn't have a setting I can see for this cropping issue).
    Also, when I've created a sequence of focus frames, I can access the marker in the in the timeline to move the focus frame.  When I click on a marker it jumps the CTI to that spot, but doesn't allow me to grab the marker.  Is there a setting I'm missing, or is there another way to move the marker. 

    See workflow below... Bill Carberry
          From: A.T. Romano <[email protected]>
    To: Bill Carberry <[email protected]>
    Sent: Monday, December 22, 2014 9:53 PM
    Subject:  Premier Elements 12 zoom vs crop
    Premier Elements 12 zoom vs crop
    created by A.T. Romano in Premiere Elements - View the full discussionastrofun I have not finished by testing on the issue that you present. I created an 4K video so that I would work through the details that you are presenting. In spite of these  zoom and crop that you feel are occurring randomly and for which you seek an explanation, are you getting the wanted pan and zoom effects when the video returns to the Expert workspace Timeline from the Pan and Zoom workspace. I am suspecting that this zoom and crop that you are seeing is solely in the Pan and Zoom workspace and are reflecting the mechanics of your establishment of the focus frames as you move the Timeline Indicator from the first focus frame  (first frame of the video) from left to right.  Not exactly sure what you mean!  
       - I highlight my clip, then open Pan and Zoom tool
       - When opened, the tool has 2 focus frames marked... one at each end of the clip.  I am not able to grab the marker and move either of these on the timeline (or any subsequent time frames).  Once I create a frame its there... I can't mover it by the marker (as soon as I click on the marker the CTI comes to that spot, and I can't get to a menu or screen change when I click on the pan duration
       - What I have been doing is deleting the default focus frame #2, moving my CTI to the place where I want a pan to stop, and inserting a new focus frame, then size and locate it on my image.
       - Follow this exact procerdiure and on some clips I get a zoom with the whole frame filling the screen, and on some clips I get a crop with only part of the screen being filled.  
     I will try to post some screenshots in the morning to show you were my thinking went on that. ATR If the reply above answers your question, please take a moment to mark this answer as correct by visiting: https://forums.adobe.com/message/7038598#7038598 and clicking ‘Correct’ below the answer Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: Please note that the Adobe Forums do not accept email attachments. If you want to embed an image in your message please visit the thread in the forum and click the camera icon: https://forums.adobe.com/message/7038598#7038598 To unsubscribe from this thread, please visit the message page at , click "Following" at the top right, & "Stop Following" 
    Start a new discussion in Premiere Elements by email or at Adobe Community For more information about maintaining your forum email notifications please go to https://forums.adobe.com/thread/1516624.

  • Running AppleScript with Adobe Acrobat to rotate and crop file.

    I constantly receive PDF files from a third party service provider that I always have to ROTATE and CROP in order to fit perfectly into labels that are perforated.
    The Label sheets are 8-up (2 x 4). If I print it as is, they DON'T fall where they supposed to. I can't get the trird party service provider to alter the way they supply the PDF files (they just not helpful). I thought it is still easier for me to do the neccesary adjustments.
    What I want to do is:
    (1) rotate the document (multi-page PDF) 180 deg
    (2) crop leading edge 3mm.
    (3) if possible, I want it to be able to watch a folder and do this automatically as PDFs are dropped into a defined folder (can be set permananetly) and save OVER the old file.
    I know AppleScript can do this (I think), but I don't have the expertise on AppleScript to write the commands.
    Can anyone help?
    I am using Mountain Lion & Acrobat 8.

    Thanks for the reply. I can still open the file in excel and I understand that I can redirect the file to open in another program. But it doesn't solve my problem that when I email the file to someone else it tries to open the file as a pdf (which it basically isn't) and gives the error message that its an unsupported file type. What I am really looking for is a way to stop it from saving an excel file as an adobe file even when I choose the file format as an excel workbook when I save it.

  • How to zoom and pan with Edge animate?

    Hi,
    I have been trying to make a project with Edge Animate, it is all about an image, but I want to be able to zoom and pan the image. Can you please send me an example if there is any around? or Can you explain me how to zoom and pan with Edge Animate?
    Thanks,
    Guasch

    I am having this same issue! I am searching through forums on what tools to use to create a good zoom and pan on an image that contains hyperlinks an other things, developed in Adobe Edge Animate.
    So far, here are some solutions I have come across:
    http://craigfrancis.github.io/zoomify/
    http://zynga.github.io/scroller/demo/dom.html
    These two seem to be the closest solutions to what I'm looking for. Now I just have to integrate the javascript into my adobe ege animate composition. Hopefully that won't be too hard. Are there any suggestions from the adobe community on how to do this?

Maybe you are looking for