Hello,

I am trying to create an image slideshow that just fades automatically. I think the tough part is complete, but the site I am building is responsive and the javascript I am using has a set width and height of the image. Is there a way I can input a variable in this code so it responds to the CSS width and height? Here is a link for the initial set up: www.andyrichin.com/index2.php

Javascript code in the header file

Code:
<script type="text/javascript">

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [1400, 625], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["/Images/Home/image1.jpg"],
		["/Images/Home/image2.jpg"],
		["/Images/Home/image3.jpg"]
	],
	displaymode: {type:'auto', pause:6000, cycles:0, wraparound:false},
	persist: true, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "always",
	togglerid: ""
})

</script>
As you can see, the actual HTML code is a simple DIV tag with the ID "fadeshow1". The dimensions are right below that. If you scale the webpage that I provided above you'll notice everything responds except for this, due to the fixed width and height in the javascript. Any thoughts or solutions? Is there a better tutorial or way to do this? I essentially want a background image that spans the browser, fades 3 images, and also responds to the browser size. Thanks a lot in advance!