image size auto

I have the following script in my HTML code :

$(document).ready(function() {
    $("#slider").SexySlider({
        width     : 560,
        height    :开发者_开发知识库 400,
        delay     : 3000,
        strips    : 10,
        autopause : true,
        navigation: '#navigation',
        control   : '#control',
        effect    : 'cascade'
    });
});

I want the image width to be auto. If I put a value like 560px, if I have an image smaller than 560px the smaller image repeats itself. How can I avoid this?

Might work:

$(document).ready(function() {
  $("#slider").SexySlider({
    width     : $(this).parent().innerWidth(),
    height    : $(this).parent().innerHeight(),
    delay     : 3000,
    strips    : 10,
    autopause : true,
    navigation: '#navigation',
    control   : '#control',
    effect    : 'cascade'
  });
});

Use a png and make any image less than 560 wide have a transparent area in the gap between the image's actual size and the 560 width. So, if the image is 260 pixels wide, put a blank area 300 pixels wide directly to the right of it and output it as a png.