FORUMS: list search recent posts

Cross Fade Image Gallery Messy On First Load

COW Forums : Web Design

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Simon Matthews
Cross Fade Image Gallery Messy On First Load
on Oct 30, 2013 at 11:23:37 am

Hi,

I have a banner with a cross fade image gallery. When you load the page for the first time (when it isn't cached) all of the images load up one after the other on top of each other, which looks messy for a moment. I'm sure you all know what I'm talking about!

Is there a way to eliminate this? I think I recall someone explaining how to do it in a tutorial some time ago, but I don't think I paid enough attention and now I can't find the tutorial.

Thanks in advance for your help!


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Oct 30, 2013 at 4:34:51 pm

hello...

short answer is yes you can get around that, but the longer answer would require seeing your code in action to see what is missing and how it could be fixed in your specific situation.

can you post an example of your gallery?

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Oct 30, 2013 at 6:03:28 pm

Hi,

Thanks for replying.

Here is a link to one of my websites. It's not the one I'm working on now but it uses exactly the same code for the image gallery, though I'm using larger images on my current project, which makes the issue stand out more. The JavaScript can be found right at the bottom and the list of images can be found nearer to the top.

Thanks,

Simon.

http://www.triangledesignandmedia.co.uk/


Return to posts index


Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Oct 30, 2013 at 6:18:09 pm

hello...

i can't reproduce the issue, but after looking around, it seems like you have a js call to an "infinite carousel" library in your head that results in a 404, so clearly you weren't using that - i see after googling that you are using this one:

http://www.simonbattersby.com/blog/simple-jquery-image-crossfade/

look at the questions posted for it - i think question #18 is your issue, yes?

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Oct 30, 2013 at 7:02:04 pm

Hi,

Thanks for pointing out the unused JS call. My code tends to get a bit scruffy after trying different things out. Sometimes I leave things in if I'm not sure what they are doing, but I didn't realize it would be a problem. I'll try to be neater in the future.

Yes I think that's the one I'm using. Well spotted with question number 18! Though this fix somehow doesn't work for me. When I load the page up after clearing the cache I still see the images loading up, and I briefly see the underlying images, which makes it look a bit untidy. It does happen with the link I sent you but not so much as with my current project, probably because the images are larger. You actually told me about the issue with my site when I first made it a few months back - you were advising me to use less images in my gallery because you could see them loading up one on top of the other. It's not very noticeable with that site mind, but it does spoil my new project somewhat.



Thanks for taking the time to reply,

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Oct 30, 2013 at 7:09:34 pm

hello...

best thing i can suggest is to extract out just a snippet of code into a separate test page that just is the gallery script. you can even use random sample images from other servers - just something big. then play around just on that sandbox page with the css and other settings to see if you can get rid of it or otherwise stop it from happening...

always easier to just isolate a specific issue and work on it separately. if you want to post that page once you get it done, we can look at it there and try some other options.

sitruc


Return to posts index


Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Oct 30, 2013 at 7:18:21 pm

Okay, thanks, will do that and get back to you! :-)


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Oct 31, 2013 at 10:52:24 am

Hi,

Tried the image gallery on a page of its own. The only problem is, the gallery now appears too quickly to be able to see whether or not the image preload code is effective, although at a guess I'd say the images are still appearing line by line down the page instead of smoothly - except it's so fast you can't really see in the test - both with and without the preload code.

I'm assuming it isn't effective as the code is identical to the original code in my web page, and is also identical to the code on the tutorial page, other than the names of the divs. I've tested it over and over with an empty cache and sometimes you can see the underlying images for a brief moment as the page is loading. With my current project, one of the images contains a logo with bright pink text. This stands out a lot as the images are loading. You can't always see it, but sometimes you can. If the preload code worked then I'm assuming this should never happen.

Simon.


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Oct 31, 2013 at 11:26:54 am

Ah, I'm thinking that the #18 fix doesn't actually preload the images, it just hides the other images until the first one is loaded onto the screen. I also just noticed an extra line of code in the #18 fix that wasn't present in the fix I found on another forum, so I was wrong to say the code was identical. I have now added that extra line of code, which is thus: $(window).load(function(){

The first image is still loading up slowly down the page but I'm not sure if the other images can be seen whilst this is happening. I tested it lots of times yesterday with the underlying images not showing for ages and then suddenly showing, so I'll have to keep an eye on it to see if it works.

I'd still like to know of a way to actually preload the images before anything starts displaying on the page though, so that I don't get that line-by-line loading of the image. Just to make the page loading look neater.

Thanks,

Simon.


Return to posts index


Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Oct 31, 2013 at 5:48:58 pm

hello...

you can preload easily with jquery (well - with javascript...this is just jquery syntax):

http://stackoverflow.com/questions/476679/preloading-images-with-jquery

try that out...remember also that you can do your sandobx page with any graphics - find ones that are as huge as possible - you can of course force dimensions on them to make them fit, but that won't make them smaller filesize-wise...so go get some giant pictures of space or something from nasa and use those for testing... :-)

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 2, 2013 at 4:53:45 pm

Hi, sorry for the slow reply, been making alterations to my site and lost track of time!

Thanks for the preload link, will give that a try. Does all of the JavaScript go in the head or does some of it go in the body? I'm guessing the top JavaScript (not jQuery) in the green ticked reply needs tags?

Thanks,

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 2, 2013 at 5:09:16 pm

hello...

well - raw javascript is loaded in the dom in the order received (so to speak). for years it was considered standard practice to put all your javascript in the head of the page, but lately the more correct way is to put it right at the foot of the page before the end body tag, but it's not something that is written in stone. where you put a script block technically makes no difference, and it was/is put in the head primarily just to keep the body clean...but there is a valid argument for having it load last on a page behind everything else.

here's a good summary of this:

http://elegantcode.com/2010/03/30/your-javascript-goes-where/

one thing to note - if you have something in a document ready or a window load block, that will not happen as it is found, but rather after either the document (dom) is ready or the window is fully loaded. it's a subtle difference, but technically window load comes after that. but if you have something in one of those blocks, no matter where they are in the page, they will happen then and not as they are discovered during loading.

does that help clear it up a bit?

sitruc


Return to posts index


Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 3, 2013 at 11:16:15 am

Hi,

I was a bit confused, wasn't sure if the script was meant to be split into two separate chunks, with the "// Usage" chunk going in the body and the code above that to go in the head. I'm guessing now that it all goes together in one single chunk?

Anyway, I've tried the script at the bottom of the body and it doesn't work for me at all. I tried the JavaScript and the jQuery versions (copied and pasted, then changed the names of the images), both did nothing to change the way the page loaded. The banner still appears line-by-line instead of instantly.

Tell you what, here's a link to my website so that you can see how the banner loads down the page instead of instantly (with an empty cache). By preloading the images I was hoping to avoid the way the banner appears down the page.

http://www.deezinehub.co.uk/

The reason I was reluctant to show you my website at first is because I am offering a web design service - and I'm far from an expert on the subject, but to hell with it, you're in on my secret now! :-D

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 3, 2013 at 6:17:12 pm

hello...

any web page is going to be a top to bottom thing...so in terms of order of javascript and if it should be in a block - what's above something else will happen first. how you set it up beyond that is layout preferences, although it is standard practice to group js code into blocks or an external file if it needs to be reused...

so here's an example i made on jfiddle:

http://jsfiddle.net/sitruc/WhyGD/

you can see the order things are output in there. i added a wrinkle to it to make a point, which is the bar() function - because it is a function, even though it is above the document ready, it won't be run until it's called, which i do in the document ready block. you can play around with that to see the order of things to get a better feel for it.

however here, i think you can eliminate 99% of your load issues by simply reducing the file size of your slides - they are *HUGE* by web standards (500kb each!) - i saved one here as a 60 quality jpg out of save for web in photoshop and it looked just as good and was only 40kb - 90% file reduction. right now you are loading 6 images - assuming they are all like the first one and 500kb each, you're loading 3mb of images, whereas reduced to jpgs, you could be loading 240k - so 6 images for half the file size of one of your current ones.

also - you are preloading them twice - once at the top of the page, and once at the bottom. you should remove one of those. but i'm betting if you make these 30-40kb jpgs, all your flickering you're seeing will go away and you can get rid of both of the preloads...

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 4, 2013 at 10:00:40 am

Hi, thanks for explaining the order of JavaScript. At the moment I have put learning JavaScript on hold as it was getting too much for me with all the animation, Cinema 4D and After Effects etc. I've resorted to just copying and pasting for now without really knowing what's going on. The way things seem to be going with me though, I may end up concentrating more on understanding JavaScript instead of animation.

I didn't realize I was preloading twice? There's some script at the top which is greyed out - is this what you are referring to?

With the image sizes, what I plan to do is finalize the page and then compress the images. I've already changed the banner images several times during development, so to avoid repetitive compressing I will do it all at the end. I probably wouldn't have uploaded the site to my host yet, but I'm not sure how to view pages in my browser when there is a contact form included.

So you say that any web page is a top to bottom thing. I understand that, but I thought that by preloading the images they would display more quickly, as though they were in the cache? Isn't that what preloading is? If not then I don't see any point in preloading.

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 4, 2013 at 5:34:20 pm

hello...

i see your top preload is commented out yes. preload is typically used when you are trying to have a mouseover element or another bit of code that will show an image not otherwise loaded initially. after discovering the massive size of your images, i believe that i had misinterpreted your issue, and that a preload is probably not necessary because your images are all loaded in the div html code in the cycle at load time. therefore you can probably get rid of all preload.

however, we go back to a chicken/egg problem - you are trying to fix a problem where you have images flickering in the cycle, but you are using giant images that take several seconds to load. but then you mentioned here that they were just temp placement images until they were finalized...so in that sense, you are trying to fix a problem that won't be a problem once you use the final properly sized images, yes?

try making them jpgs that are as small as possible wrt file size to see if it gets rid of your problem (after you also remove the preload)

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 4, 2013 at 5:53:03 pm

Hi,

Well yes, compressing the images will make them load faster onto the screen but still not fast enough to eliminate seeing them load up down the screen I don't think, which is not as pretty as having them load instantly. Once the images are cached they appear more instantly. I presumed preloading images would have the effect of delaying anything being displayed on screen until the images are loaded, then displaying the images in a more instant way, as though they were cached? This is not an issue that is vastly important to me but I thought it might make the loading slightly neater and I would use it if it was available.

While we are on the subject, can you recommend the best way to compress JPeg images? Can it be done from within Photoshop or should I use a compression application or website?

Thanks,

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 4, 2013 at 6:12:25 pm

hello...

[Simon Matthews] "Well yes, compressing the images will make them load faster onto the screen but still not fast enough to eliminate seeing them load up down the screen I don't think"

have you verified this? it's why i suggested creating a single simple page that only does this image cycler, and also do it using final production-size images. if it still flickers, then you can work solely on it with additional css and javascript tricks to get it working. that said, his basic demo:

http://www.simonbattersby.com/demos/crossfade_demo_basic.htm

has a few 80kb images and suffers no flicker issues. therefore, i'd guess that it's also other stuff on your page - you have a ton of other images and all are png files that seem to average around 30kb - when i cleared my cache and ran firebug, it totaled 4mb (!) of images - you shouldn't ideally be at more than 10% of that worst case. so you are probably having flickering because of the large volume of content (images) on the page. that's why you should make a simple page loading final compressed images - if you don't see it there, then you know it's not the culprit.

wrt saving - save for web in photoshop is more than up to the task for saving web-ready image files - go with that...

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 4, 2013 at 6:48:05 pm

Hi,

Well I've seen the issue occur lots of times when loading other people's websites, so I guess that has verified it for me as an issue that exists. For example, it occurs slightly when loading Video Copilot's website. I think I've seen it occur on one of my own sites after image compression but can't answer with 100% certainty on that one. I'm pretty sure it occurs, but obviously to a lesser extent. I don't see much point in comparing my full website homepage that includes a 900x400 pixel banner to a page consisting of just a small cycler in the corner of the page. The smaller page is going to load up quicker isn't it.

As I think I said earlier, I have already tested the image cycler on a page of its own. When the cycler is on a page of its own the issue is barely visible. Unfortunately my image cycler is on a website with a lot of other information, which slows down the process, making the issue visible. Is it possible to preload images so that nothing is displayed on screen until the images are loaded? This is what I am asking. It's not essential but it would be nice to know. There's either a way or there isn't. If possible I'd like to know if there is and thought you might be able to tell me.

Your JPeg image compression advice is duly noted and will be utilized in the future! Actually, I had never noticed the option for saving for the web in Photoshop until you mentioned it, so thanks for that! :-)

Thanks,

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 5, 2013 at 1:26:38 am

hello...

[Simon Matthews] "There's either a way or there isn't. If possible I'd like to know if there is and thought you might be able to tell me."

there is a way - i didn't look at his code specifically but being a javascript programmer for years now, i can tell you that there's a way to either (a) alter his simple example or (b) just write your own...in all likelihood it would be the addition of a mixture of css and a simple js loop to check if the image is loaded and show it when it is. could even be pure css - again i didn't get too far into his example.

in your case, however, since learning javascript is not a focus right now, i'd suggest that you just leverage an existing plugin for this functionality (all the plugin will be is the same thing but with some wrapper and additional functionality around it that insulates you from the guts of the thing) - there are a million of them that would do just fine. i think his was just a case of writing a simple example that didn't require the overhead of a plugin, but at that level you have to know the code.

this one in particular is very easy to use - give it a shot!

http://jquery.malsup.com/cycle/

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 5, 2013 at 12:35:22 pm

Hi,

Thanks, I just worked out a simple way to do it actually. You just add display:none to cycler image.active in CSS instead of display:block and then add an extra line in the JS to show cycler image:active. However, doing it this way actually makes the page loading look worse, even after I compressed the images in JPeg! The rest of the page is displayed before the cycler, and there is a much longer pause before the cycler is shown than I thought there would be, which looks messy. It looks better just left alone to load up as normal! I suppose to do it right you'd have to programme it so that nothing at all is displayed before the cycler, but for the minimal difference you'd get it's not worth me pursuing that avenue.

Thanks for bearing with me on this experiment of mine! At least I now know about the save for the web in Photoshop, which is much better than the way I was doing it before - I used to upload each pic to an on-line compressor, which was time consuming and is the reason I delayed it until the page was finalized. Now I can compress the images from the beginning.

Oh thanks for the link to the jQuery cyclers too, may use some of those in the future!

Thanks again,

Simon.


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 13, 2013 at 11:54:00 am

Hi Curtis,

Can you help me out with a little problem please? I need to create a cross fade image carousel like the one I use on my website but I want it to stop on the last image without going back to the first image again. I'm guessing it can be done by making an amendment to the code I'm already using?

Here is a link to a website that has the effect I'm trying to create:

http://www.fresherclean.co.uk/leather-cleaning-plymouth-exeter/

Note the small images that contain the place names fade between 3 different images and then just stop. I also want to have the images fading in slowly like they do in that website.

Can this be done by amending the following code?

http://www.simonbattersby.com/blog/simple-jquery-image-crossfade/

Thanks,

Simon.


Return to posts index

demetri tashie
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 2:07:33 pm

sorry for jumping in here....

simon - the very first example (Variations on the basic crossfade) from Simon Battersby's Jquery image crossfade that Curtis provided for you is exactly what you are asking:

Variations on the basic crossfade

Cycle through images once and then stop

look at his example, view the source code, and you can see the slight modifications to the code to keep it from re-cycling a second time.

cheers


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 2:30:22 pm

Hi,

Thanks for pointing that out, I hadn't noticed that, although after sending in my question I did find the same solution further down the same page as a response to a question someone had sent in.

I do have another slight problem now though: I have my images fading in very, very slowly (as in the example website I attached), but as the first image fades in you can see the underlying images fading in as well. To achieve the fade in I set the display to none on both img and img.active in CSS, then I added the following script to the cycler to fade them in:


$(window).load(function(){
$('#cycler-sub-banner2 img.active').fadeIn(3000);
$('#cycler-sub-banner2 img').fadeIn(15000);
// run every 7s
setTimeout('cycleImages2()', 7000);
})

The problem with this is, the active image and the other images start to fade in at the same time. I need a way to delay the fading in of the other images so that they don't show through. Any ideas would be much appreciated!

Thanks,

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 5:00:04 pm

hello...

the short answer is that you need chaining...here's a fiddle i made to demonstrate this:

http://jsfiddle.net/sitruc/6JG8Z/

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 7:15:40 pm

Hi,

So could I put id="one", id="two" etc. on each of my cycler images for this to work with a cycler?

Eg:




And then just add your function somewhere in the cycler script?

Thanks,

Simon.


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 7:21:24 pm

Sorry, it won't let me type out an example for some reason. Basically my example was adding an id of 'one', 'two', 'three' etc. to the image tag of each cycler image.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 7:31:19 pm

hello...

no - that was just a simple example of chaining. while i definitely want to help you, i don't have the time at the moment to write up a fully functional example using your code. it'll be best if you study that, read up on jquery chaining a bit and give it a shot in your own code.

basically what is happening there is that the function listed as an argument is called after the fade. here's the api docs for this:

http://api.jquery.com/fadeIn/

hope that helps. best you learn what is going on vs. us just writing it all for you, though. :-/

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 7:50:54 pm

Okay, thank you. Wasn't really expecting you to write out something for me from scratch (though I really appreciate it when you do), was hoping that there was something out there already available. My knowledge of JS is extremely limited but hopefully I will find time to study it a bit more at some point.

Thanks,

Simon.


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 7:56:11 pm

hello...

[Simon Matthews] "hoping that there was something out there already available"

there are more plugins than you can probably count that do exactly this using jquery. i pointed you to one somewhere in this thread, but here it is again:

http://jquery.malsup.com/cycle/

or query "image cycle jquery" or the likes. you are currently trying to modify a simple example that this guy made, which is very good for learning, but if you just want a plugin and don't want to understand the guts, try the one above.

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 8:21:33 pm

Thanks, the issue I am having occurs when the cycler fades in for the first time on page load. The cycler fades in very slowly, with the other images slightly visible as it fades in. Not sure which of the examples on the link you attached has this slow fade in effect from page load?


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 14, 2013 at 9:29:40 pm

disclaimer: i'm not trying to be rude here - just talking very matter-of-factually...please take it just as that... :-)

here's the issue: you want an example that fixes a custom bit of code that you have enhanced. i gave you an example that covers chaining, which is what you need to do. there will not likely be an example that covers your specific issue with the code you have started with unless it's on that page that you took it from in the first place...so in terms of an example, this is about the best i can do without getting into your full working code, finding what you want to change and posting the exact code to change it.

the above would be an example of learning jquery and javascript in general. you have said you don't necessarily want to do that right now, which is completely understandable. if that is the case, however, then i recommend that you implement an existing plugin (such as the one i linked to) so that you don't need to get anywhere near as far into learning javascript at this time.

but as it stands, you now have the information that you need to fix this. again, i don't have the cycles right now to tailor an example to your specific code and write up that solution for you. you have taken a custom piece of code and further customized it - the best anybody at this point can do short of writing it up in your specific custom code is to point you at a simple generic example that covers the concept that you need (chaining, in this case) and the api.

if you read that api and play around with the fiddle, you can figure it out for sure, as that is the answer. however, that goes back to learning vs. implementing...but that is your choice at this point, really...

i hope that makes sense. once you start customizing a custom thing, you can't find examples online that exactly and perfectly plug into your code. you have to take the idea and implement it into your code...that's sort of a staple of programming, unfortunately, that we cannot get around here. if i had more time, i'd take your code and write a solution for you, but i just don't at this point... :-/

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 15, 2013 at 11:37:50 am

Okay, I was just hoping there might be a single line fix to this like there was with the other issue (the issue of hiding the other cycler images until the first one is displayed) as it seems like a similar issue to someone who doesn't know JS. I see now that it requires more than that.

Thank you for the time you have spent helping me out. You have spent much more time helping me than I expected and have offered much more script examples than I expected. It's always you who seems to reply to my queries. Maybe others should have a go sometimes as you shouldn't be expected to handle it all yourself, though you do a good job all by yourself. It boggles my mind how you find the time to write out all the JS Fiddles.

Thanks again,

nomis


Return to posts index

Curtis Thompson
Re: Cross Fade Image Gallery Messy On First Load
on Nov 15, 2013 at 4:18:55 pm

hello...

it probably is close to one line, but the time comes in going through a page, figuring out where what is, isolating the issue and trying to offer a solution that can't be verified because i can't run the code myself to make sure... :-)

the easiest way to get assistance will always be to post a page with the item in question and preferably only that item in question on the page - so in this case again just the images and the related js code that is acting on them with some basic html wrapper - but not the whole page. that way we can quickly look at it, perhaps even easily copy it locally or to a fiddle and give it a shot there to verify what we are saying is true.

chaining here is probably your answer, but i can't just say "oh - change foo.bar() to foo.esp.bar()!" without easily having access to the whole picture.

(that's why writing the fiddles is so quick, btw - it's a blank slate and i'm writing it and testing it as i go - that's a lot easier way to go at it)

go ahead and post a page with just the latest js code and the image block and i can look at it probably tonight or tomorrow.

and thanks for the thanks - i'm always glad to help out whenever i can!

sitruc


Return to posts index

Simon Matthews
Re: Cross Fade Image Gallery Messy On First Load
on Nov 16, 2013 at 9:48:49 am

Hi,

Oh man, you're going to love this! It suddenly came to me last night, your JS Chain Fiddle is exactly what I need. For some reason I had it in my mind that it had to be part of a cycler, but since in this case I only need three images to fade in then stop on the third image, a cycler isn't needed. I'm assuming the images can fade in on top of each other using your method, perhaps by setting the z-index higher on each image. I don't know why I didn't realize sooner, it must be because I have too much going on in my little mind lol :-)

Fully understand what you mean about posting just the code with the issue, will do that in the future.

Well, thanks again and sorry it took me a few days for it to sink in!

Simon.


Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2017 CreativeCOW.net All Rights Reserved
[TOP]