www.webdeveloper.com
Results 1 to 2 of 2

Thread: Dynamically resize images

  1. #1
    Join Date
    Aug 2009
    Posts
    13

    Dynamically resize images

    This question has been asked a hundred times, but I haven't been able to find the perfect solution, -yet.

    I have a page where i load pictures dynamically when user clicks <- or -> buttons, with some simple jQuery.
    Code:
    $.post('/v2/_ajax/loadImage.php', { 
    
    event_id: event_id, image_id: image_id,
    }, function(data) {
    target.html(data);
    });
    What i need, is a way for the picture to be resized, if it exceeds 900px in width, OR if the height is bigger than the browser - 60px.

    I have tried the jQuery plugin MaxImage (http://www.aaronvanderzwan.com/maximage/) but it has some very strange behaviour, and it only resizes when you resize the browser, not when the image is loaded.

    Is there any good solution?

  2. #2
    Join Date
    Oct 2007
    Location
    Western Massachusetts, USA
    Posts
    387
    You could check each image element on the page and simply set the CSS/HTML properties for width/height via Javascript.

    HTML Code:
    var img = document.getElementById('someimage');
      if (img.width > 900) { document.getElementById('someimage').width = 900; }

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles