Results 1 to 4 of 4

Thread: Cropping images in Step Carousel Viewer

  1. #1
    Join Date
    Jan 2011
    Posts
    52
    Thanks
    10
    Thanked 0 Times in 0 Posts

    Default Cropping images in Step Carousel Viewer

    Script http://www.dynamicdrive.com/dynamici...epcarousel.htm

    I am using different sizes of images that will be uploaded by the users. Is it possible to crop the images automatically to 187px x 187px without using a cropping plugin?

    Thank you,

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    3,033
    Thanks
    25
    Thanked 599 Times in 575 Posts
    Blog Entries
    40

    Default

    To get the neatest and most consistent result, resizing images (to generate thumbnails) on the server-side, with a combination of PHP and ImageMagick, would be a good solution. If you want to investigate further, have a look at this tutorial: https://coffeeshopped.com/2009/01/cr...nd-imagemagick

    Alternatively, if the uploaded images will be reasonably small, and of a similar size and proportion, you might be able to get away with just using CSS. You could, for example, remove the img element from inside each step carousel <div class="panel"> and use a combination of background:url(path/to/img.jpg); and background-size:cover; to fit/auto-resize background images on the actual <div class="panel">. More info on background-size http://www.sitepoint.com/css3-background-size-property/

    Bear in mind that background-size:cover; wont work in IE8 and under. Although, maybe a default image in an IE8 stylesheet could be an option (just some pre-sized filler in lieu of the carousel for old IE browsers)
    Focus on Function Web Design
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps

  3. #3
    Join Date
    Jan 2011
    Posts
    52
    Thanks
    10
    Thanked 0 Times in 0 Posts

    Default

    Thank you for your reply. I have used https://code.google.com/p/resize-crop/

  4. #4
    Join Date
    Jan 2011
    Posts
    52
    Thanks
    10
    Thanked 0 Times in 0 Posts

    Default

    I am using multiple step carousels. The second one is used inside jquery tabs. The navigation arrows are not appearing in local copy but when uploaded to the server they are appearing. Please see the tab Photos (26,222) tab at http://www.emailforusa.com/travel/

    The arrows appearing on other tab contents also. While inspecting the element are are just above the closing < /body > tags.

    Also sometimes the arrows are not appearing. While refreshing the page they are appearing.
    Last edited by Paramasivan; 06-26-2014 at 07:33 PM.

Similar Threads

  1. Step Carousel Viewer (auto step)
    By Mission Impossible in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 04-22-2013, 11:48 AM
  2. Replies: 2
    Last Post: 10-25-2009, 07:46 AM
  3. Resolved Step Carousel Viewer v1.6.1
    By armababy in forum Dynamic Drive scripts help
    Replies: 7
    Last Post: 01-24-2009, 10:00 PM
  4. loading Step Carousel Viewer in middle of carousel
    By sam4682 in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 12-31-2008, 11:07 PM
  5. Problem loading images with Step Carousel Viewer
    By dancort in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 10-17-2008, 05:35 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •