I have a jQuery plugin (jcarousel) that creates a rotating carousel of pictures. Each of these pictures was originally designed to have a hyperlink button carrying the user to box office site. The buttons are images with text in them.
I have altered the button image to a blank canvas in which I can change the text based on the event. I need to:
1) Adjust the background images (which are either cropping or masking) so they resize/display correctly. I would like to move the images to the html file so I can make easy changes without navigating the css each change.
2) Adjust the button to resize based on the text in the hyperlink.
3) Adjust the text in the button to display centered horizontally and vertically in the button, wrapping text if the button exceeds a certain size.
I know this is a lot in one question, so please feel free to answer any part of the question, or maybe comment on changing the way I am handling these tasks.
Rather than paste code here, the files are located at http://www.nightaliveent.com/builds/testing/ with the actual page named "testpage.html".