Hi,
I am trying to have a fading banner for my restaurants dining pages. unfortunately I need a quick fix (within 9 hours). my site is www.thebuxtedinn.co.uk. within the dining page I have 5 available menus, each with their own page. At current each of the 5 different menus has a static image. I need a rotating banner for each of the menu pages (same size as the static image and similar fading effects to the homepage) which I can have unique images on each which fade like the rest of the site.
This should be a very straight forward problem as other existing pages already have a rotating banner feature, so you might be able to use some the code.
The dining page and its menus can be found here:
http://thebuxtedinn.co.uk/menu/
so 5 transisitng banners need to be made, the images of which I can determine by editing the style sheet would be ideal.
I would also like to remove the Orange link effect which occurs when you hover over the different menus and make the images link to the desired menus.
Any help would be appreciated.
Charles Klycinski answers:
Hey,
This is awsome jquery script. Im using it on few site as a rotating banner.
http://tobia.github.com/CrossSlide/
smwilson comments:
cheers, ideally i would like someone to log into my FTP and make the alterations. I know the price may be too low but due to the short deadline this question will be useless soon if not one accepts it.
Thanks for you help
Charles Klycinski comments:
Just read Your email :)
Charles Klycinski comments:
Duncan,
slider takes images from a config file. I was coding the slider. The php function creates js code for each page.
Charles Klycinski comments:
Ok. All is done.
Duncan O'Neill answers:
Hi smwilson,
your problem is that there are no images included between your <script>
tags on the menu pages. Below is the code on your home page which operates your slider;
<script>
$(function() {
$('#slider_home').crossSlide({
sleep: 5,
fade: 2.5
}, [{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/cooking.jpg' },{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/lamb.jpg' },{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/cheese.jpg' },{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/hams.jpg' },{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/harveys.jpg' },{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/Buxted-Inn-Restaurant-113.jpg' },{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/Buxted-Inn-Restaurant-110.jpg' },{ src: 'http://www.thebuxtedinn.co.uk/wp-content/uploads/Buxted-Inn-Restaurant-106.jpg' },
])
});
</script>
Compare this with the code on your menu page;
<script>
$(function() {
$('#slider_short').crossSlide({
sleep: ,
fade:
}, [
])
});
</script>
You need to add images to that code, as per the code above.
I don't know what theme you are using, or how you've included the images for the home and other pages.
Perhaps the easiest way to find the code to edit would be to do a search within your local theme folder for the string '#slider_short'. When you find the relevant template file ( it may use 'template' in its name if you're using a different template for these pages, as seems to be the case ) just edit the code above to include your image files.
Or, I should be able to find a solution quickly with FTP details.
hth,
Duncan O'Neill comments:
So can you not just edit the config file?