maxImage: jQuery image scaler – Now with center-ability!

maxImage is a jquery plugin that I wrote a few months ago that automatically scales images based on how much room they have in the browser window. The image will always fill your browser window. I have built a basic demo mini site for the plugin.

Note: For some reason I have lost the post that originally contained the release of my plugin. I would like a place for users of the plugin to contact me and let me know how use of the plugin is going. Please use this space, the comment area to let me know how using maxImage is going, what you would like to see added or changed.

154 Responses to “maxImage: jQuery image scaler – Now with center-ability!”

  1. Aaron Fineman Says:

    This is a great script, but I was wondering if there is a way to have the image stay in the center of the site and scale by top and bottom or left and right sides? – does that question make sense?
    Or if it is possible to manually control the slideshow that would be great too – like a giant gallery.
    thanks,
    aaron

  2. DAvid Says:

    Hello Aaron,

    Great script ! Thx a lot !
    I’ve got just one issue on Firefox (3.5) on Mac OS X when pushing the Space bar : the image goes down like if there was a scroller…

    Sorry, my english is too bad :/

    ++

    DAvid

  3. Aaron Vanderzwan Says:

    Thanks David… I will look into this.

  4. Aaron Vanderzwan Says:

    @Aaron. Thanks for the feedback. Unfortunately maxImage does not support your scenario right now. I apologize, but will keep it in mind as I work towards future releases. Thanks.

  5. DAvid Says:

    Thanks Aaron, it’s just a minor issue… i can reduce it to the max with topSpace attribute in my case…
    I will give you the adress of the site where I’m using your script when it’s ready :)

    ++

    DAvid

  6. Jesper Ordrup Says:

    Super script. I found the same issue as DAvid.

    I’m planning on using the slideshow effect on background images. Is it possible to start with random? Or specify starting image (then I’ll just feed it a random number)?

    Thanks
    Jesper

  7. Jaume Bosch Says:

    Hi, all.

    The script is working perfect with major browsers but i found that it doesn’t work in Firefox 2.

    Is there any chance to making it wokr in that browser?

    Sory about my english and thanks.

  8. Aaron Vanderzwan Says:

    @Jesper. I apologize but currently the script does not have the ability to start on a random image or specify a starting image. It does however, start with the first image every time. You can use this to your advantage and randomize the order on load, before calling the plugin, which would result in the same effect. Hope that helps.

  9. Aaron Vanderzwan Says:

    @Jaume. Hi there. Do you have an example that I can check out where it is not working in Firefox 2? That would be a great help. Thanks.

  10. Jesper Says:

    Thanks Aaron. That’s doable for sure. I just wanted to be sure that U didn’t provide this feature bfore doing it myself

    thanks
    jesper

  11. Rutger Says:

    Grrreat! Thanks for this amazing plugin!

    Maybe a fade option for the slideshow? Nevertheless, i just love it!

  12. Rutger Says:

    Spend some time but due to your plugin i’ve redesigned my homepage completely. http://www.heijmerikx.com/

    Thanks again!

  13. Woody24 Says:

    After some fighting, I’ve finally figured out how to get this to work in WordPress. It also doesn’t help that I’m not that well educated about javascript, or PHP.

    But my question is, is it possible to have a scrolling page, with the image still stuck in place? I have some pages the go longer than the ‘fold’, but now that I’ve added this plugin, the scroll bars are gone. I guess I just figured that the background wouldn’t move when scrolled.

  14. Woody24 Says:

    oh, another question. How does the “verticalAlign: ‘bottom’” code work? I’ve changed it to both top and bottom, and didn’t notice a difference. I have a photo that is taller than the window, and I’d like for the bottom of the photo to start at the bottom of the window, and all the eccess of the photo goes past the top of the window.

    Thanks

  15. Aaron Vanderzwan Says:

    @Woody24 and all others who have asked about verticalAlign. I have fixed the bug that was not allowing the verticalAlign to work correctly on the slideshows. Please take a look at the new release and let me know if it works well for you. I do warn you though there are a few other updates too, so don’t push live without testing first.
    Download the newest release here: http://plugins.jquery.com/project/maximage

    I apologize but currently the overflow is set to hidden. I am looking into this for the next release.

  16. Rutger Says:

    How can i pause the slideshow on the background? Or isn’t that possible? Thanks in advanced for any reply.

  17. Aaron Vanderzwan Says:

    Rutger -

    Your website is amazing and powerful. A great usage of maximage. Do you mind if I use your website as an example of how maximage can be used to make powerful, dynamic websites?

    My only suggestion, would be to do what you can to make your large background images are less than 500k. One of them (ijsselpath.jpg) looked like it was over 1.6MB. But other than that, what a wonderful site. You are a WONDERFUL photographer!

    Unfortunately, right now, I do not have any way to pause the slideshow. I will think about this with future releases though.

    What a great website.

  18. Mael Says:

    Hi
    I tried something to simulate the window scrollbar :
    I made a parent div “#viewport” with “overflow:auto” andthen I fixed its height to the document’s one :

    var myheight = $(window).height();
    $(‘#viewport’).height(myheight);

    It actually display the scrollbar as excepted when the document exceed the window size, but if I resize my browser “#viewport” will keep the same heigt. The page should be refreshed when resized.

    I think it’s a good start to fix the overflow issue. If you have an idea for refreshing at resizing…

  19. Mael Says:

    This works :

    CSS:
    #viewport {overflow: auto; position: relative;}
    The div #viewport is the direct child of body.
    JS :
    var myheight = $(window).height();
    $(‘#viewport’).height(myheight);
    $(window).resize(function () {
    $(“#viewport”).height(document.documentElement.clientHeight);
    });

    I tested it in FF3, ie6 7 & 8, Safari 4
    I once had an error in ie7 but could’nt reproduce it…

  20. Aaron Vanderzwan Says:

    Solution to the scrollbar problem

    Hey Mael and all others who are trying to use maxImage and preserve the use of the overflow hidden attribute. I appreciate your initiative to get this to work the way you need to. That is needed with these plugins. It is impossible to create a tool that does everything for everybody.

    That being said, the reason why I disabled the scrollbar was because I was noticing that some browsers would calculate the width of the browser differently and therefore would make maximage a little inconsistent at times.

    I have just released a version with an “overflow” option that can be set to auto to re-enable the scrollbars [Download it here]. If you are using maxImage for it’s background image or background slideshow functionality, you can use position:fixed on the image so that the image doesn’t scroll.

    See an example here:
    http://www.aaronvanderzwan.com/maximage/bg.php

    I hope that helps. Also, Mael, your solution seems wonderful and definitely should work. Maybe a little more complicated than it needs to be at this point. If we notice that my solution is just too darn buggy (I’m nodding in your direction IE), your solution might be a good fallback… if you don’t mind me using it.

    Enjoy all. And let me know how this update works. Do you notice any problems?

  21. Thiago Azurem Says:

    :) This script do not accept fadeIn opacity configuration, I tried to use FadeTo but dont works.

  22. Aaron Vanderzwan Says:

    I’m sorry Thiago, the plugin is not built to support fadeTo.

  23. Mael Says:

    I’m glad to help !
    I won’t test the new release now because I use the older on a soon-online site, but I will give you feedback if I find any problem in a future use.
    Thanks again for sharing this !

  24. elgin Says:

    Hi again Aaron,

    Please disregard the previous email from me. Duh? I’ve got everything working now.

    Thanks,

    elgin

  25. Helder Says:

    Your plugin works great for me but only one question:
    Is there a nice work around for aborting the slideshow en playing the slideshow?

  26. Richard Bakker Says:

    Hi Aaron, this plugin is cool.
    I was wondering, would it be possible to put an image centered on a page with a padding lets say 20px and let it scale/resize on browser-resize ? Thus, something like the fullscreen/background solution, but not let it fill out all the way.

  27. Aaron Vanderzwan Says:

    @Richard Bakker
    This should be possible. It gets a little more complicated when you want to use the offsets. Do you have a URL that I can see? I might be able to help point you in the right direction.

    Thanks.

  28. Jerry Liu Says:

    Thank you for your Great Job!
    Can you make a more detail document? thanks.

  29. Aaron Vanderzwan Says:

    @Jerry Liu
    I have been meaning to do this, but I just can’t seem to find time. Is there anything you are having trouble with?

  30. Dennis Says:

    Hey,

    great script! But i have one question. When i have a resolution of 1024 x 768. The background on end of the page will cut off the background. Can you handle it?

    Please awnser on my E-Mail-adress.

    Greetings
    Dennis

  31. Aaron Vanderzwan Says:

    Dennis -

    I have sent you an email.

  32. Theo Ribeiro Says:

    Hi Aeron,

    First of all, thanks for the great job, this plugin is a great implementation!

    I have a special need I believe many people may have. I would like to ask you if it’s possible, or if you have ever done it (I have a very limited jQuery knowledge as I’m a photographer not a web-designer).

    I’m trying to use the Plugin with images contained in a div that already resizes with the browser window but the images should not exceed the div boundaries as they do using maximage.
    What I need is to set max-width and max-height of the image to 100% (so it doesn’t exceed div size).

    I want to have a fluid layout, otherwise I could use the offset properties, etc but they just wont do…

    If I do this through CSS, it works as long as the user reloads the page after resizing but it doesn’t quite work dynamically as it should.

    Have you though of this or could you give-me a hand with this?

    Thanks loads in advanced and again, congratulations and thanks for putting up maximage!

    Theo

  33. Aaron Vanderzwan Says:

    Hi Theo-

    Do you have a URL that you can share so that I can check out what you are trying to do? That would help a lot.

    Thanks,
    Aaron

  34. Vince Says:

    Hi Aaron,

    first of all, congratz for the terrific work done with this plugin. Simply amazing !!!

    Do you know if there are conflicts between your plugin and the Galleria plugin (http://devkick.com/lab/galleria/) ?

    I am trying to use both at the same time with no success …

    Thanks. Vince

  35. Aaron Vanderzwan Says:

    Hi there Vince.

    I do not know if there are any problems with using maxImage and Galleria. I have actually never used it. It looks good though and might have to look at it sometime.

    Let me know if you have any success. And if there is a URL where you are looking at it so I can check it out.

    Thanks.

  36. daniel Says:

    hi, great plugin, but what’s happening if i have more then one image on page?
    is there any way to handle multi img resize.

    Tnx, Daniel

  37. Aaron Vanderzwan Says:

    @daniel

    I have not tested the plugin for more than one image on a page. However, I have built another plugin, called maxgrid, that resizes images so that they fit to a grid.

  38. Terio Says:

    Hi

    Thanks for a great script, it is currently in use by one of our customers. We plan on using it on more sites, so I hope that you will continue maintaining it? Or that older versions will continue to work as they are – I suppose that is the case…

    WIll be back with links later on!

  39. Richard Bakker Says:

    Hi Aaron, i’m back again :’)
    I am trying something else, what if I want to have to 2 images next to each other – can this work somehow ? (I have more portraitshots than landscape)

  40. Aaron Vanderzwan Says:

    Hi Richard -

    I’m sorry, but currently the plugin does not handle that. It would have to be reprogrammed for multiple images. Please take a look at maxGrid though (http://www.aaronvanderzwan.com/maxgrid/). I have not tested this, but it might work with just two images in that plugin. maxGrid is not an official release so please test A LOT before going live with it.

    Let me know how it goes.

  41. Syrehn Says:

    is it possible to have this contained inside a div instead of setting the vertical and horizontal offset.

  42. Syrehn Says:

    I believe my question is something similar to Theo’s.

  43. Aaron Vanderzwan Says:

    Hi Syrehn –

    Like I requested with Theo, can you please send me a URL where I can see the issue you are having and what you are trying to accomplish. That would help a lot.

    Thanks,
    Aaron

  44. Syrehn Says:

    Hi Aaron,

    I’m trying to accomplish something what I have done here:

    http://www.designfoxmediaworks.com/clients/peaverymart/

    I have managed to get my image to resize because I know the width that the containing div is when fully expanded and have it set to scale down to 30%. (this is done without yourscript)

    I wanted to use your script to accomplish the same thing but have it as a background image in the div perhaps so that I could have functioning links above the image.

    I hope that made sense?

  45. Syrehn Says:

    any thoughts?

  46. Aaron Vanderzwan Says:

    Hi Syrehn-

    I’m sorry if i just got to your comment to late (this is a little over a week after you posted your URL), but the link that you posted is not working. I am getting a 404.

    Please post again with a different working URL.

    Thanks,
    Aaron

  47. Rutger Heijmerikx Says:

    Hi Aaron!

    I’m sorry to say that i just saw your reply on my comment. Of course you may use my site as an example. I’m planning on optimizing it indeed. An image above 1Mb is a bit large.

    Greets and thanks for your superb plugin!

  48. AK Says:

    Hi,

    Just using your plugin and most is working well. Thanks! I just need to know if you can fix the problem with resizing the first image on each slideshow. The first image in each slideshow doesn’t scale and is fitted to the size of the browser you start with. I checked your example and it did exactly the same thing. If you could help me with this that would be great!

    Thanks,
    AK

  49. Matt Johnson Says:

    Is there any way to control the slide show? Next/Previous buttons.

  50. lingjaidee Says:

    script slide bg is very interesting for me ;)
    nice script & thx for inspiration

    from THAILAND

  51. Murat OVA Says:

    Where Parameter For Fade Speed ?

  52. edward Says:

    hi aaron. great plugin. works beautifully on all browsers i’ve tested on, except for Firefox 2 on PC. it shows only the background color. thoughts? i was racking my brain on this, but i also checked your example site (http://www.aaronvanderzwan.com/maximage/) and your site doesn’t display the image either.

    here’s my example: http://eddieshrake.com/AP

    thanks much

  53. Aron Says:

    Hello!

    Hello, when i try to implement your script for the dynamically scaling background image, i get vertical and horizontal scrollbars.

    does the base image have to be a specific size? no matter how i resize the windows, the scrollbars stay ….

    greetings Aron

  54. IK Says:

    Hi AK,

    I got the same problem as you where the first image of the slideshow didn’t want to resize, i had a look at the “jquery.maximage.js” file and altered the following to get it to work:

    Approx. line 201, under //SLIDESHOW FUNCTIONS:

    change this bit from:

    if(currentImage==0){
    _start_timer();
    }

    to:

    if(currentImage==1){
    _start_timer();
    }

    Approx. line 214:

    change this bit from:

    function _start_timer() {
    var currentSlide = 0;

    to:

    function _start_timer() {
    var currentSlide = 1;

    Approx. line 236, under // Start time for slideshow :

    change this bit from:

    var slideInterval = setInterval(function(){
    if(currentSlide < opts.imageArray.length-1){
    currentSlide++;
    lastSlide = currentSlide-1;
    } else {
    currentSlide=0;
    lastSlide = opts.imageArray.length-1;
    }

    to:

    var slideInterval = setInterval(function(){
    if(currentSlide < opts.imageArray.length-1){
    currentSlide++;
    lastSlide = currentSlide-1;
    } else {
    currentSlide=1;
    lastSlide = opts.imageArray.length-1;
    }

    I don't know any Javascript though what it seems to do is make it start from the second image, so that means you will need to add a blank placeholder image to the list of images so it recognises this as the first image and therefore will be skipped.

  55. Aaron Vanderzwan Says:

    @AK, and IK
    What browser are you working in where you are having this problem. This is not a problem in all of the browsers that I am viewing it in (I’m on a mac).

    @Matt Johnson
    Unfortunately I do not have any way to control the slideshow with Next/Previous buttons yet, but will keep this in mind when I find time for the next update.

    @Murat Ova
    The parameter for fade speed is slideDelay.

    @Edward
    Your website looks beautiful. I am currently downloading Firefox 2. I will pull it up and give it a look. Hopefully I will be able to see something that will resolve your issue. Is Firefox 2 a large market share for users?

    @Aron
    I would check your other CSS. By default, maxImage hides the scrollbars with overflow:hidden. You can control the overflow-y with the ‘overflow’ parameter. But like I said, it defaults to hidden. Make sure you don’t have any other styles controlling this. Do you have an example I can look at?

    @IK
    I thank you for your fix, but would really like to fix this issue without having to put a blank image in the first space. Could you let me know what browser, what platform, how many images, the size of images, and any other information you think could help. I would really appreciate it. It sounds like it has something to do with load time or order and when I check the dimensions of the images. Thanks again for your interest in helping this issue get resolved.

    @ALL
    Thanks for the positive feedback. I am sorry I have been so busy lately, but I look forward to upgrading maxImage to take advantage of the speed upgrades in jQuery 1.4. Keep the comments coming, I want to help get this thing working as smoothly as possible.

    Thanks again.

  56. Bjarne // Mums Studio Says:

    Hey Aaron!

    First, thanks! This is by far my preferred way to make websites with fullscreen BGs. One thing I miss though – haven’t digged into this myself yet – is slideshow with navigation. Perhaps just simple next / prev or even numbered navigation.

    Just an input!

  57. IK Says:

    Hi Aaron,

    Yes, that blank image thing i did was pretty nasty, the site i’ve been working on uses 5 images, all at 1080x810px, thing is i get the same thing happening on the slideshow page on your site as well (http://www.aaronvanderzwan.com/maximage/bgslideshow.php).

    So far i’ve tried this on Safari 4 / Firefox 3.5 on Mac OS 10.5.8 and IE6 / IE8 on XP SP3, all with the same result, when you resize the browser the first image stays the same size and seems to pin itself to the bottom left corner of the browser window.

    Hope that helps!

  58. Boyce Hedeen Says:

    Great blog, although I think some of the stuff on itt is a little pre used lol.

  59. tinkdiff Says:

    dear Sir,

    please have a look to this website:

    http://ayerviernes.com/

    can this plugin to have an easing effect when the browser resized just like that website ?
    it would be cool if you have a navigation for the image slide

    please advise

  60. Kai van Lingen Says:

    Hi there,

    First things first, thanks for this great plugin.

    I was wondering if there is any way to center the image vertically?

    Your help would be great.

  61. steven yeung Says:

    HI Aaron,

    I am using your plugin and I am trying to build a simple website.
    What I am finding when you your plugin is that when I am stretching the browser window, image rescales no vertical scrollbar appears but a horizontal one does.

    Is there something I am doing wrong.

    I am testing it on safari 4.0 and firefox 3.5

    When looking at your site no scroll bars appear at all.

    Please can you help me.

    Thanks

  62. Kevin Ross Says:

    Hi Aaron, thank you for writing a great plugin. I’ve used it for my webpage located at: http://www.twentyfourmountains.com I’ve also added an optional callback function that is called after the background image is loaded. I’ve used this to animate the page fade-in only after the background image has finished loaded. If you are interested in it you can find the diff here: http://www.twentyfourmountains.com/Files/maximage_onImageShow.patch

    Thanks again for a great plugin!

  63. Reo Says:

    Because sentences are made with a translation software, it might be strange.

    HI Aaron,

    First of all, we wish to express our gratitude for making the good one.

    It is IE6 correspondence, and the demo page has been generated, too. The background image has fallen below.

    The background image falls into the page that I made below in IE6.
    http://www.harusa-web.com

    Is there a problem in a Japanese version of IE6?

  64. Reo Says:

    I’m sorry.
    It changed it into another plug-in.
    Moreover, it uses it on another page.
    Thank you.

  65. Chris Says:

    Hey Aaron.
    I’m trying to use this plugin with a centered div (ie. margn: 0px auto;) and it doesn’t keep the image centered but to the right of the div when it resizes, any idea to keep it exactly centered in the browser window no matter what?
    On top of that I’m trying to use it JQuery Cycle Plugin and it works on the initial image, but none of the others.
    Thanks again for making this, if I can get it to work how i need it, its exactly what i needed!

  66. gnarwrangler Says:

    Chiming in to say that I finally found the issue causing the first slide in the slideshow to not resize properly.
    Change the section ~line 217 from:

    if(currentImage < opts.imageArray.length-1){
    currentImage++;
    _loads_image(currentImage);
    }

    To:

    if(currentImage < opts.imageArray.length-1){
    _loads_image(currentImage+1);
    }

    This should fix it.

  67. Jean-Marc Says:

    Hi

    Great job, thank’s a lot !

    I try it, but i have a problem : how to diseabled Title in a slideshow (the title which is back right) ?

    Have a good day

    JM

  68. bHab Says:

    The script is great but I am also having the problem with the first slide not resizing, this is happening on your sample page as well for me. I tried the fix from gnarwrangler but it didn’t work for me, and removed the 2nd slide out of 3 from the rotation.

    These are the browsers I have tested:

    Mac

    FF 3.5.8
    Safari 4.0.4
    Chrome 5.0.307.11 beta

    PC

    IE 7.0.6001.18000
    IE 8.0.6001.18702
    Firefox 3.0.16
    Safari 3.2.3

    Thanks again.

  69. Jon Says:

    I’m with Bjarne — Any way to make the slideshow usable with a Next/Prev type function?

  70. Aaron Vanderzwan Says:

    Hey guys -

    I am going to take a look at the script soon (hopefully this weekend) and iron out, once and for all, the first slide not resizing issue. I will take a look at all of the suggestions and see what I can add to the plugin.

    I will let you all know how it goes.

    Also, I appreciate your patience as it has taken me quite some time to get back to some of you. My life has been quite crazy lately.

    Thanks,
    Aaron

  71. Aaron Vanderzwan Says:

    There is an updated version, 1.1.3 here. http://plugins.jquery.com/project/maximage. The first slide works as expected. I ended up using gnarwrangler’s fix. Let me know if this is still an issue for anyone.

  72. bHab Says:

    Hi Aaron.

    Just a couple of console.log calls, lines 207 and 209, but other than that works perfectly!

    Thanks for making the time to look at this, much appreciated.

  73. Aaron Vanderzwan Says:

    Thanks for catching that bHab. whoops. I have updated the file and you can get it (without the console.log calls) over at http://plugins.jquery.com/project/maximage... 1.1.4.

    @all. I think until a 2.0 release, I am not going to add much extra functionality. I’ve been thinking of breaking maxImage apart to create a maxSlideshow or something. I think they are two separate functions and it’s not worth loading all of the overhead data if you don’t need it. Does anyone have any thoughts one way or the other about that idea?

  74. Aaron Vanderzwan Says:

    So I have put up another release (1.1.5):
    http://plugins.jquery.com/project/maximage

    This release actually uses the position option to set the position. But like I said in the release, position fixed doesn’t work in some IE browsers. Please, as always, test this in all of your targeted browsers extensively before going live.

    Also… here is a feed to subscribe to the comments on this post:
    http://feeds.feedburner.com/CommentsOnMaximageJqueryImageScaler

    Let me know if you have any questions.

  75. Jerome Bohg Says:

    Hey Aaron,

    Great work you did there. I do have a question. The plugin works with the img tag which means you will have to include all images in your page. I wanted to use the plugin for my portfolio website but I use like 10 large images which all have to be loaded before the plugin will do its job. Is there a way to use “a” tags with an “href” instead to point to the image files?

    Many thanks in advance and keep up the good work!

    Jerome

  76. Lennard van de Laar Says:

    Aaron,

    thx al lot for the script!
    I’m having a small problem, verticalAlign: ‘bottom’ doesn’t seem to work.

    Thanx in advance and keep up the good work!

    Lennard

  77. Aaron Vanderzwan Says:

    @ Jerome
    maxImage is not set up to use anchor tags currently. May I ask why you need all of the images to load before the plugin begins doing it’s job? Maybe I can work something out for you.

    @Lennard
    Please take a look at the homepage of the demo (http://www.aaronvanderzwan.com/maximage/), you can see an example of the verticalAlign working the way it is supposed to. There is a catch with verticalAlign: ‘bottom’ though… you cannot use it in conjunction with overflow: ‘auto’… are you trying to do that? Do you have a URL to an example of where you are trying to use it? I can help you out better if I see what you are trying to accomplish.

    Thanks guys.

  78. Jerome Bohg Says:

    Hey there Aaron. To answer your question about the images being loaded, if I put lets say 10 images on the page which I want to use for the plugin, they will be loaded as soon as I open the page. At least that was what happened when I tried the plugin. So I thought maybe it would be a better way to get the image source from a anchor tag to prevent long loading times. I hope this helps. If not I can setup a testpage so you can have a look. Thanks in advance for you time. Really good to see you really try to answer all the questions you get.

  79. Aaron Vanderzwan Says:

    @Jerome
    The maxImage slideshow starts running after your first image is fully loaded. All of the subsequent images load in the background. I have created an alternate slideshow page with larger images so that this is a little more noticeable. http://www.aaronvanderzwan.com/maximage/bgslideshow_alt.php

    Take a look. If I totally missed your point, I apologize. My guess is that I would be able to help you a bit more if you were to set up a test page that represented your problem.

    Thanks again.

  80. Jerome Bohg Says:

    Sounds good Aaron. I think I’ll to some more tests with multiple images and if I still feel like it’s not working as assumed I’ll drop a message. Btw, your last names indicates you have some dutch relatives?

  81. Aaron Vanderzwan Says:

    @Jerome
    Sounds good Jerome. Do let me know if something isn’t working correctly. I’m sure we will be able to figure something out for your needs.

    I definitely have a dutch background and dutch relatives. My father immigrated to Canada from The Netherlands when he was 5 years old. I was born in the USA but carry many of the dutch stereotypes… (tall, blonde, blue eyes). Unfortunately, I do not speak the language or have ever been there… however I definitely want to go visit sometime. Do you absolutely love it?

  82. Jerome Bohg Says:

    You should visit the flatlands sometimes. I think you’ll be in total shock to find out how many people live on such a small piece of the world. We don’t have any mountains so you can leave your snowboard at home.
    Do I love it? Well I think there’s good and bad everywhere, but yes I have a very happy life over here.

  83. Aaron Vanderzwan Says:

    @Jerome
    Sounds good. I will visit sometime. Glad to hear. Keep me updated with how using maxImage goes for you.

  84. Jerome Bohg Says:

    Aaron, I figured out what the problem was when using the plugin. I had forgot to add html { overflow-x: hidden; } to my css file and I had to set a z-index for the backgroundimages. This prevented that the last backgroundimage (when using slideshow) is set on top of the rest of the HTML on my page. I dont know if this helps in any way but I solved the issues for me. Will test the plugin in IE6 & 7 to see how that works out, I have good hopes Aaron!

  85. Tutorial Jquery – Slideshow Di Foto Come Sfondo Del Sito | Fedeweb Says:

    [...] si fa a realizzare questa tipologia di siti, utilizzando maxImage un plugin jquery, realizzato da Aaron Vanderzwan dove viene già spiegato come utilizzarlo, ma c’è qualche dettaglio di cui discutere per far [...]

  86. Nacho Says:

    When put image (maximage) as background and some flash over, ie6 and ie7 moves the flash to the bottom. IE8 do it right. Is possible to fix it?

  87. Tyler Smith Says:

    Thanks for the hard work here Aaron. Your script provided a quick solution for what could have been a daunting task.

    I have used maxImage for a very small school project. Merely a landing page, but your script brings the piece together nicely. Great work!

    http://www.thinkcreatestudios.com/platzer/ (link to site with maxImage implored)

  88. Aaron Vanderzwan Says:

    @Nacho
    My guess is you have to do some massaging in order to get flash to display over maximage in IE6 & IE7. I would first try playing with the wmode setting of the flash piece. wmode=”transparent” or “opaque” might help. If that doesn’t work, make sure the content’s z-index is greater than the background image (it defaults to -1). In my experience… if you want to set the z-index of an element in IE6&7 (there are SO many little bugs) you have to set it’s position too… so your css would look something like this for your content.
    .flashContent {position:relative;z-index:1}

    Let me know if you get it.

    @Tyler
    I’m glad to see it helped you out. The site looks great by the way.

  89. GB Says:

    Hi Aaron, I’m trying to install this with an Indexhibit install and I’ve gotten it to work on one image, but I need it to apply to all the images on the page. I have applied class=’maxAtOrigImageSize’ to each image that I want your script to work on, but only the first is sized.

    Also, how can I make it not display overtop of my lefthand menu?

    *removed link*

    Please remove the link after you check it, thanks!

  90. Aaron Vanderzwan Says:

    @GB
    It’s been a day so I don’t know if you took down what you had, but the link you gave me links to an empty page. Could you send me another link to my email address?

    I’m assuming you have multiple images so do you want to do a slideshow? If so, you can reference : http://aaronvanderzwan.com/maximage/bgslideshow.php

    Let me know.

  91. Tyler Smith Says:

    Hello again, Aaron.

    I am actually having the same question as GB right now. The difference this time between my last use of maxImage is that I want to use my own slideshow functionality. Its much more convenient to be able to control it on my on terms, I suppose.

    So basically, what I am looking for is an array of images to all be maxImage-afied, so that they are all behaving in a scalable manner, without needing to be in your designated slideshow. However, I have come to a pretty convincing conclusion that only one image can be scalable from your function at a time if the slideShow variable is not ‘true’.

    I am trying to go through your code to see why this is, but my brain is quite scrambled. :)

  92. Aaron Vanderzwan Says:

    @GB and Tyler

    So honestly, I didn’t think about that as a use case. It actually does sound like that would make the plug-in much more versatile…

    Give me until next week… I will see what I can do.

  93. Tyler Smith Says:

    Looking forward to what you come up with!

  94. kerry Says:

    Hey Aaron, great little script. Any chance you could have a look at this; file:///Users/kerry/Documents/Work/Girl%20Two%20Doors%20Down/main-files/cool-pink/aboutus.html & tell me why I cannot for the life of me getting the vertical scrollbars to work.??

    Would be much appreciated.

    Thanks beforehand.

  95. Aaron Vanderzwan Says:

    Hi Kerry -

    Thanks for using the plugin.

    Have you tried changing your image’s class to ‘bgmaximage’?

    Let me know when you have done that.

    Thanks,
    Aaron

  96. Aaron Vanderzwan Says:

    Also, it looks like there are two declarations in your code, one script tag that contains all of the maximage calls that are on the demo site, and then another specific one for just bgmaximage. Try removing the first script tag that contains all of the maximage calls… i am unsure how multiple calls would effect a single image.

    Thanks again.

  97. Aaron Vanderzwan Says:

    @Kerry

    I hope you don’t mind, but I wanted to try something out. I have added your example to my demo server. You can view it here:
    http://aaronvanderzwan.com/maximage/kerry/press.html

    also, you can download the zip of my changes here:
    http://aaronvanderzwan.com/maximage/kerry/Archive.zip

    Please note… I did change all of your relative URL’s to absolute URLs, so you might want to change those back.

    Let me know if you still have questions and when you get this so I can take it down.

    Thanks.

  98. Townii Says:

    Hi.

    I use wordpress and I don’t know where to integrate the code ?
    If you can answer me by mail to see it together.

    Thank you

    Anthony.

  99. Tyler Smith Says:

    Hey Aaron, where you able to make any ground? :D

  100. GB Says:

    Sent you an email last night man, you get it?

    I hadn’t meant that I wanted a slideshow, what I was trying to do was this: I have an Indexhibit page with say 20 images. I am wanting to list them horizontally on the page and have the page scroll to the right with all the images scaling up or down correctly to the user’s full browser height, with no vertical scrollbars. I was trying to do it with your ‘Image follows a browser edge’ version.

  101. shantu Says:

    THANK YOU VERY MUCH FOR THIS GREAT SCRIPT. I PLAYED A LOT WITH THIS.

    I read that the script does not provide a random function for the slideshow. And You wrote it’s possible with

    “randomize the order on load, before calling the plugin, ”

    I’m a beginner in Javascript. Can You tell what You mean exactly with with Your suggestion?

  102. Aaron Vanderzwan Says:

    @Townii
    I’m sorry that I haven’t been able to get back to you. I would imagine that in wordpress you would put it in the header.php template in between the <head> tags, but I have not tested this yet. Let me know how it goes.

    @shantu
    Please take a look at the following link for an example of a random slideshow. This would have to be cleaned up a bit and tested, but it is the gist. I guess what I’m saying is that this can be done outside of the plugin so I am hesitant to put it in.
    http://www.aaronvanderzwan.com/maximage/randomSlideshow.php

    @Tyler, BG and all else who are waiting for the custom functionality.
    I have been working on it and am really close. I need to test some things yet but it’s coming. A stripped down scalability option will be built in so that people can use their own custom slideshows. This upgrade will make it simple to achieve what you are trying for GB.

    As always, let me know if you have any questions.
    Thanks.

  103. GB Says:

    Sounds good Aaron, any rough idea on when we can expect this? I’m trying to get this portfolio done a.s.a.f’n.p. ;)

  104. shantu Says:

    THANK YOU AARON!!! I will test ist and see how it work, will send you than the link.

    I can’t wait to see the updated version. I’m a big fan of this script.

    greatings from berlin

  105. Bjarne // Mums Studio Says:

    Hi Aaron.

    I’m experiencing an odd thing with your plugin. Let’s say I load 10 images (image01, image02, image03, etc.). When I look in the source code, the “sort” by name, meaning first image is image01 and last is image10. But in the slideshow, the order is turned around, and image10 is the first one and image01 the last.

    I don’t see any way to change the sort order in your demos?

    Thanks…

  106. Aaron Vanderzwan Says:

    @ GB
    I have been really busy with moving lately. I hope to have it up, at least a beta version, by the end of the week.

    @ Mums
    I’m sorry, but I don’t think I’m understanding correctly. If you look at the source code of http://www.aaronvanderzwan.com/maximage/bgslideshow.php you will see that slide01.jpg is the first image. It is also the first image that shows up in the slideshow. The last image is slide08.jpg and that is the last image shown in the slideshow. I think I have misunderstood your problem though. It should be that the first image in the code is the first image in the slideshow. If this is not happening please send me a link with an example.

    I’m sorry if I totally misunderstood your issue.

  107. Bjarne // Mums Studio Says:

    Look here (a site I’ve developed for a friend);
    http://grass.nu/work/hoje_ambitioner/

    This is the first image in the source code;
    http://grass.nu/wp-content/gallery/hoje-ambitioner/thumbs/thumbs_ha_001.jpg

    and this is the last one;
    http://grass.nu/wp-content/gallery/hoje-ambitioner/thumbs/thumbs_ha_003.jpg

    When the page loads, the slideshow starts with the last image, and generally goes the wrong way.

    Does it make sense?

  108. Tyler Smith Says:

    Sounds great Aaron. Can’t wait!

  109. Aaron Vanderzwan Says:

    [Sidenote]
    You all should know that I’m not getting paid for building maxImage. I am happy to help you if you have an issue with using maxImage and love to share the knowledge that I have, but I don’t want to get pushed into doing your jobs for you. I also don’t want you guys to blow your deadlines because I am so busy.

    If you have enjoyed maxImage and feel as though it is working out for your projects… please feel free to donate whatever you think is fair, at the main maximage page using the donate button on the left:
    http://www.aaronvanderzwan.com/maximage/

    Okay. Here is a VERY beta version. I’m sure that this still has many bugs in it and I haven’t even opened it in IE yet. But I know some of you are on deadlines so if you want to do some debugging, go ahead.

    Here is the 1.1.7-BETA (Very Beta) download:
    http://www.aaronvanderzwan.com/maximage2/scripts/jquery.maximage-1.1.7.js

    @GB
    I might try setting your image height to 100%. That should scale in modern browsers, however, if that doesn’t work with some CSS finagling, I have set up how to do what you are trying to do with maximage 1.1.7 at this URL:
    http://www.aaronvanderzwan.com/maximage2/customHorizBackground.php

    @Tyler
    Let me know how it goes. You have to use an option called ‘customSlideshow’ and still use ‘isBackground’. You also have to wrap your images in a container and specify the container’s class to maximage as you can see at this example:
    http://www.aaronvanderzwan.com/maximage2/customSlideshow.php

    I hope to be doing some more work on this soon and solidifying an actual release.

    Thanks.

  110. GB Says:

    Hey Aaron, any advance on this?

  111. Nerea Says:

    Hi Aaron, thank you four your work, it´s a gife for all of as. But I need a litle bit more of your help, I want to adapt the image inside a ‘div’, not inside a ‘body’. Can you explane how to do it.
    Aaron I’m from Spain, sorry because I can’t speak good english, but don’t worry, I have help to translate your answer.
    Thanks.

  112. Tyler Smith Says:

    You are awesome Aaron. I’m sorry it if feels like you are being hounded with deadlines; I wish I could understand this resizing nonsense. :P

    I will say that you definitely have the best image scaling plugin I have found and it is definitely worth donating for.

    Something I am noticing right away, and am trying to solve without bothering you, is that the images in the customSlideshow are not scaling with a centered perspective, rather staying firm in the top left.

  113. Aaron Vanderzwan Says:

    Not a problem guys.

    @Nerea
    Is there anything specific you are having trouble with? I have had to do that before and if you give the container div a width and a height of 100% it should allow your image to resize correctly inside of it. If you are still having trouble send me the URL and I will take a quick look and see if there is anything I can see to help you out.

    @Tyler
    That’s alright. I notice the centering being broken as well. What do you think would be the best way to work with the customized slideshow? I have them all visible on load… figuring I can leave it up to the person implementing it to hide what they need to. Unfortunately, I feel like this breaks certain things. I will take another look at the center functionality and see if I can determine why it’s not working.

    Thanks.

  114. Tyler Smith Says:

    Aaron,

    I spent considerable time swimming through your plugin and stripped it down to the bare necessities of image scaling (get_orig_data, size_image, center_image). It really isn’t a plugin anymore, rather a series of functions to be worked with.

    I would gladly share it with you if you were interested, although I wouldn’t be explaining anything new. The site is rather confidential at this point, so I would rather send a link through email or something of that sort, if you did care to look.

    Also, on your end up the plugin, I noticed a few small errors inside the CustomSlideshow function. Things like $(‘slide img’), where “slide” is missing the “.” and one instance of assigning the containerClass height to pageWidth. Small things like that might be adding up to the problem. However, it was too difficult for me to figure out, hence why I took the time to strip it down.

  115. Mark Says:

    Is there any way to accomplish your neat background trick without using scripts? I am trying to avoid the viewer being bugged to death by microsoft as to whether they want to view a page containing scripts. As you well know, scripts can also do bad things to your computer depending on the intent of the script writer. And I don’t want anyone navigating away from my page because people are “not” going to open any page by God that contains scripts. I have searched the web for different ideas to accomplish this. And everything seems to work fine until you try to scroll the content. Then the image and content scroll in unison with a whole lot of white space below the background image. If you can please reply to my email address I would appreciate it.

  116. Aaron Vanderzwan Says:

    @Tyler

    That is awesome. I am glad to hear it. I will say that most of the time that it takes to update these plugins is spent on making sure that everything else is still compatible… or maybe that’s just what I tell myself ;) Honestly, the example I started with was to use maximage along with the jQuery Cycle Plugin (http://jquery.malsup.com/cycle/). I haven’t given up yet… there is just a lot that cycle does that conflicts with maximage. Especially with all of Cycle’s options.

    If you do not have my email address you can find it here… http://www.aaronvanderzwan.com/#contact... I would love to see what ended up working for you.

    Thanks.

    @Mark
    Hey man. I’m not really sure I understand what you mean. By ‘script’ do you mean javascript? Are you getting script errors in a browser? What version of the plugin are you using? What browser? Do you have a link that I can see?

    Thanks.

    @GB
    How’s the portfolio going? Which route did you end up going?

  117. Falk Says:

    Hi!

    I tried to build a fullscreen gallery using the cycle plugin, too. It’s very basic, without any options and I don’t know what it looks like in IE, but maybe it will help somebody.

    I used a resizing function from the supersized slideshow made by buildinternet.com

    You can see it in action over there:

    Fullscreen Gallery

    Cheers, Falk

  118. Scott Says:

    Hey Aaron,

    I’m playing around with the slideshow functionality of this. It’s a very convenient way to manage a series of images in Drupal. Found a little error though. If you feed it a slideshow with only one element it throws an error:

    line 178:

    opts.imageArray.push(new Array(objClicked.getAttribute('src'),objClicked.getAttribute('title')));

    I made it this:

    opts.imageArray.push(new Array(jQueryMatchedObj[0].getAttribute('src'),jQueryMatchedObj[0].getAttribute('title')));

    which fixed it for my purposes.

    I’m using it as a background within a container. So, no position:fixed, but an absolute div with overflow hidden, the maximage inside. Works smooth.

    Exactly what I needed. Nice work man.

    Scott

  119. Aaron Vanderzwan Says:

    Awesome Scott. Nice catch and thanks. I will roll that in with the next release.

  120. Twig Says:

    Nice plugin Aaron!

    Ive been trying to add pause/resume functions to the background slideshow script. I’d like to be able to stop & dim the slideshow when a user clicks a button on the page. I got it working within maxImage by modifying start_timer function and adding a .toggle on a (.project) button selector. The toggle calls a pauseShow() and resumeShow(). It would be better if I could call the pause and resume functions from outside maxImage on the calling page, so that I can chain other jquery effects after pausing. Is there a way to make the pauseShow and resumeShow public so that that they can be called from outside maxImage (ie. using a selector in page calling maxImage)?

    My sample page is here: http://wow.elevationda.com/test/test21.html
    the pause toggle button is in the bottom right corner.

  121. Bjarne // Mums Studio Says:

    @Falk
    That’s freakin’ nice! :) Maybe you should share the code or write a simple tutorial on that one…

  122. Aaron Vanderzwan Says:

    @Twig

    That makes sense. I will do that for the 2.0 release. Thanks.

  123. Masters Allen Says:

    Hi,

    We are looking into using maximage for projects we are working on. But we have a problem in IE6 which we are required to optimize for. On testing we have found that the background image is hovering over the main div, and I have had a quick test of other sites which use maximage, and they are showing the same result. Is there a fix for this problem?

    Dan

  124. Aaron Vanderzwan Says:

    Hi Dan.

    You have to be really careful when developing for IE6. If you use position:fixed you are going to run into trouble. Please open up IE6 and take a look at the plugins homepage (http://www.aaronvanderzwan.com/maximage/) and then look at the installation page (http://www.aaronvanderzwan.com/maximage/installation.php). The homepage uses position:fixed for the background image, but the installation does not. You can use the IEDeveloper toolbar if you want to check out the differences. In my experience, with the versatility offered with maximage, there is generally a way to make it work.

    If this does not help, please let me know and send me a link to a page where it isn’t working. I will take a look at it and let you know if I see anything that might help or if maxImage just isn’t going to work for what you need it for.

    Thanks.

  125. Twig Says:

    Hi Andrew
    I have a better pause/start button by adding a single exposed function called showTimer that takes an argument ‘start’ or ‘stop’ to pause/resume. The sample is http://wow.elevationda.com/test/test25.html

    I rigged it so you have to load slideshow (project) first in the top left to start the show. Once a show is loaded the start/stop button will work (the button is fixed to the right side.

    The reason I rigged it to load a slideshow is I am trying to get it so that I can switch between background slideshows. Its got it working using .clone in my calling page, but that may not be the best approach. I tried detach/appendTo, but the slideTitle would not detach with the maxImage object.

    Ultimately, I’d love to get the pager slide navigation options of cycle.js working with maxImage. Faulks mashup of cycle.js with supersized.js is close but is limited to a single aspect ratio. Have you tried making maxImage work with cycle?

  126. Twig Says:

    Hi Aaron
    I have a better pause/start button by adding a single exposed function called showTimer that takes an argument ‘start’ or ‘stop’ to pause/resum. The sample is http://wow.elevationda.com/test/test25.html

    I rigged it so you have to load slideshow (project) first in the top left to start the show. Once a show is loaded the start/stop button will work (the button is fixed to the right side.

    The reason I rigged it to load a slideshow is I am trying to get it so that I can switch between background slideshows. Its got it working using .clone in my calling page, but that may not be the best approach. I tried detach/appendTo, but the slideTitle would not detach with the maxImage object.

    Ultimately, I’d love to get the pager slide navigation options of cycle.js working with maxImage. Faulks mashup of cycle.js with supersized.js is close but is limited to a single aspect ratio. Have you tried making maxImage work with cycle?

  127. Tim Says:

    Nice plugin Aaron!
    I am a non-Flash webdesigner and I was looking for something like this!

    But I also try to “satisfy” IE7 and even IE6 users…
    And I have some problems with unwanted scrollbars, or no scrollbars at all, while testing with IE7.

    E.g.: Your example page http://www.aaronvanderzwan.com/maximage/bg.php leaves a blank spot below the background image (on IE7).

    And at http://www.aaronvanderzwan.com/maximage/ I don’t see any scrollbars at all (even when I shrink the page to almost nothing) (on IE7).

    You state “I have tested it and with a little massaging it works in IE7 & IE6.”
    Can you please tell me more about the “massaging” ?

    Thanks in advance and good luck !
    Tim

  128. Sharaot Says:

    Hi.
    When i tried to put the content the is not showing towards the end. How to change that.

  129. Shrewsbury Wolf Says:

    Firstly, can I say thank you very, very much for this plugin, it is by far the best I have tried, and believe me I have tried, alot of methods over the past couple of years!!

    I am using the slideshow feature, and I am looking to achieve a different fade transition, do you think it may be possible? If you think it can be done, please point me in the right direction. I am trying to replicate this site without using flash : samsung.com/uk/

    I have been looking at integrating this transition : http://tinyurl.com/y9ujvlc with no joy. It would be great if you could spare the time to help.

    Thank you for your time.
    James.

  130. theturninggate Says:

    Hi Aaron,

    I’m wondering about your licensing for including the maxImage script in commercial plugins. Can you shoot me an email please to discuss this?

    Thanks,
    Matt

  131. career aptitude test Says:

    hi ! Everybody !!! …. nice content ! …

  132. Mees Says:

    Hi,

    One question. I try to have a ‘sticky footer’. The footer is there but the maximage goes on top of it?

    See:

    http://www.zarinapotapova.com/index-test.html

    Do you have a suggestion how to fix this?

  133. Shrewsbury Wolf Says:

    Hi Mees

    I have got a ‘sticky footer’ working fairly well with this method:

    CSS

    #footer {position: fixed; width: 900px; height: 60px; z-index:4; top: auto; right: 0; bottom: 0; left: 0; margin-left: auto; margin-right: auto;}

    HTML

    Content goes here

    Hope this helps,
    James

  134. Shrewsbury Wolf Says:

    Sorry,

    Didn’t show the HTML markup in my last message…

    HTML
    <!–

    Content goes here

    –>

  135. Mees Says:

    Excellent thats it, thanks alot!

  136. valerio vaz Says:

    Hi,

    this plugin is great, but i’m having a little problem on my project. I have the slideshow working, but some parts of my code, only appear after X seconds of pageload. The X seconds are the same as slideDelay.

    Have a menu on a sidebar and some select boxes that don’t show on pageload. Dont know why. It seems that javascript freezes until the slideDelay time reaches it’s first cycle.

    Any help would be appriciated.

  137. Aaron Vanderzwan Says:

    @all

    I’m sorry I have been falling behind on keeping up with these requests / questions. I have been EXTREMELY busy as of late. I hope that you guys have found solutions to your problems. When you do, please post them here to help others.

    Anyone have any suggestions on if I should move this discussion somewhere more conducive to this sort of communication? Other than a blog post?

    Thanks.

  138. Kev Says:

    Hi! Thanks a bunch for this! Really is about the best out there.

    I have one (hopefully) quick question. The slideshow version of the plugin seems to be adding about 32 px of padding to the top of my page. I setup a test page with only your plugin and the word “hello” to ensure that nothing else was interfering. I have the padding and margins both set to 0px on the body class. Any idea what could be causing this?

    Thank you for your time!

  139. Aaron Vanderzwan Says:

    Hey Kev,

    Can you send me the link to the test page you are working on so that I can take a look what you are working with? Seeing it might help me realize what’s going on.

    Thanks,
    Aaron

  140. Kev Says:

    Thanks for the quick reply!

    This is a link to the site (still under construction): http://scaredrabbit.net/mawr/

    As you can see, the black header area is pushed down about 32px, although the stylesheet has

    html, body {
    padding:0px;
    margin:0px;
    }

    I also set up a quick test page without any other components, and I still had the same issue. Thank you for taking a look!

  141. Aaron Vanderzwan Says:

    @Kev

    It looks like you have a space after your opening body tag. Since you have your line-height set to 16px on the body, any html line will have that line-height of 16px. That is why you have 16px above your header element. Remove that space in between your opening body tag and your header element and you should be fine.

    Thanks,
    Aaron

  142. Aaron Vanderzwan Says:

    @kev

    Also, I noticed you have presentation HTML in your head tag. You will want to move everything that will show up on the page (images, etc.) out from within the head tags and into the body tags.

    Thanks,
    Aaron

  143. Kev Says:

    @Aaron

    Thanks again for taking a look. I made the changes, and am still having the same problem. I certainty don’t want ask you to do my job for me though, so I’ll get it figured out. I did finally get it working on a test page that didn’t have any other scripts/etc, so it must be something else I’m doing.

    By the way, I took a browse through your ‘work’ page, and you make some great stuff! Keep it up!

  144. Kev Says:

    Oooh! Just figured it out… a random had gotten into the header somehow. Sorry for placing blame on your awesome plugin :D

  145. alicia Says:

    Hi Aaron,

    First, congratulations on your pluggin,
    is great (but you already know :)

    I’m trying to make a page with your pluggin and advice from users of the blog (I borrowed the slide Rutger (very nice page))
    to show my work (I am a student of fine arts)

    As an index for the page might be interesting to use maxigrid,
    but the thumbnails are very small
    is there a way to control their size?

    Thank you very much for your energy,
    greetings,
    alicia

  146. Aaron Vanderzwan Says:

    Hi Alicia,

    You can make the thumbnails larger with maxGrid if you lower the number of columns. I have changed the number of columns to 4, take a look at how the images resize.

    http://www.aaronvanderzwan.com/maxgrid/

  147. alicia Says:

    Aaron thank you very much,
    works perfectly!

  148. Andy Says:

    Hi Aaron,

    Was just taking a look at this and noticed you’ve a quote missing around ‘top’ in line 14. I’m hoping to get it running in IE6. Some people just won’t let go of 90′s browsers!

    All the best,

    Andy

  149. Andy Says:

    Pfft, ignore that. I’m picking up on syntax before I’ve even read the code.

Leave a Reply

Note: Since I upgraded to Wordpress 2.7, I have been able to support adding code to comments. If anyone knows of a plugin (that has been tested in 2.7) that will do this, please let me know. Other basic HTML is allowed for styling.