Good quality in-house slideshows

[Dal123]

I previously used google api slideshow but it was noted by others that might not be the best solution to host pics on another site and I think he's deffinitely correct. Also not having much luck with the programming of it and remember that it didn't work exactly as the online guides - had problems with the link to the album.
I've found this one but not sure that I like as there is a hell of a lot of mark-up just for a little slide show. I have found many poor quality ones but does anyone have any good ones they have used in the past where I can obtain decent code that will minimise the mark-up on my site?

 

[Dal123]

Just found this http://www.punteney.com/static/examples/yui3-slideshow-animated/#default which looks pretty good.
Just wonder if it's possible to slow the transition down a little.

 

[highres]

SlideShowPro. Works great, good GUI and literally thousands of customizable options. I've been using it for years and love it.

http://slideshowpro.net/

 

[angelwatt]

Just found this http://www.punteney.com/static/examples/yui3-slideshow-animated/#default which looks pretty good.
Just wonder if it's possible to slow the transition down a little.

At the top of the page you link, hit up the Docs link, then go to Configuration. It has all of the customizations that it handles, including the transition speeds.

 

[Dal123]

Thanks for that link highres - appreciated.
Thanks again angelwatt, things are looking good .

 

[Dal123]

Here is how it is at the moment on server http://www.preciseformwork.co.uk/new-site/top1.php
I'm trying to configure the basic slideshow from putney http://www.punteney.com/static/examples/yui3-slideshow-animated/ and so far haven't had much success.
I have created a folder called 'ani-slideshow' which contains the four javascript files that you download from the site and host yourself http://www.punteney.com/builds/yui3-slideshow-animated/#download kept the original names and customised in the javascript on my page and have images in foler of my root 'images/my images.jpg'

<script src="ani-slideshow/gallery-slideshow-base-min.js"></script>
<script type="text/javascript">
    YUI({
        modules: {
            'gallery-slideshow-base': {
                fullpath: 'ani-slideshow/gallery-slideshow-base-min.js',
                requires: ['node', 'event', 'widget']
            },
            'gallery-slideshow-animated': {
                fullpath: 'ani-slideshow/gallery-slideshow-animated-min.js',
                requires: ['anim', 'gallery-slideshow-base']
            }
        }
    }).use("gallery-slideshow-animated", function(Y) {
        Y.SlideshowAnimated.auto();
    });
</script>

<div class="slideshow">
    <img src="images/slb/pi-1.jpg" class="slide current">
    <img src="images/slb/sl-10.jpg" class="slide">
    <img src="images/slb/sl-1.jpg" class="slide">
    <img src="images/slb/sl-69.jpg" class="slide">
	<img src="images/slb/sl-92.jpg" class="slide">
	<img src="images/slb/sl-98.jpg" class="slide">
</div>

I'm pretty close to getting it to work, the first image is loading up on the screen. Is anything standing out that I've missed?
Any input welcomed.

 

[angelwatt]

There's a 404 error for this script, /new-site/ani-slideshow/gallery-slideshow-base-min.js

Make sure you have it uploaded to the correct location and named properly including the correct case.

 

[Dal123]

How did you find out that error? I've tried a few test scripts but they show me nothing.
I've had a good look at it and the filenames are correct and in the correct location.
Obviously something is wrong, but can't find it yet. Could it be a possibility that my page content div etc is set as absolute position with relative positioned grandparent (you know what I mean) and maybe confilcting with the slideshow actions, though I wouldn't think so as most sites are like this.

 

[angelwatt]

How did you find out that error?

Web Developer Toolbar add-on for Firefox. The script is now there, but is incorrect. You saved an HTML version of the script. See here. If you view the real source there's HTML tags. This won't work. The script needs to be saved as plain text. The same is true for this script file.

 

[Dal123]

Woo, thanks so much angelwatt, been on this for two days now and you've just cracked it. Thank-you sir .
I'm not even going to attempt to adjust the width and transition times yet as I've not got much content displayed on my site yet. Gonna try to code some pages then have a look at the formatting.
Can't thank you enough

 

[Dal123]

To bother with http compression?

My current home page is only about 898 KB and 817 KB is with my photos for my slideshow. I can change them from 140KB jpeg to about 60KB png format in image ready. Does not seem much difference viewing the photo from image ready, but I wonder if mobile phones may have a little problem with the png's. I know all browsers nowadays accomodate png's. Do you guys think I should change them to optimized png's?

I notice when I view the page size I get scripts: 80 KB (215 KB uncompressed) so they must be naturally compressed. Wonder whether or not to try this or not. Found article on how to do it http://kennethhunt.com/archives/001969.html

I wonder whether or not I should bother trying to compress my page or not. Obviously my page isn't massive but I will be having portflio pages with an awful lot of photo's being displayed by lightbox so need to think about it as I hear that google now takes page load speed into consideration when ranking.

 

[angelwatt]

Images are already in a compressed format, unless you use bitmap. Doing any further compression will just be a waste of time as far as images are concerned.