PDA

View Full Version : You Spin Me Right Round!


DeeryMe
05-31-2011, 10:05 PM
Hello All

I am still learning but enjoying getting to grips with Dreamweaver...

I have just followed this tutorial - http://www.communitymx.com/content/article.cfm?cid=651FF, and created a nice effect with a rotating image - brilliant stuff however I want to create more than one of these effects on the same page - does anyone know how I can easily modify this to do the same with another rotating image side by side the one I have just created?

Thanks for taking the time to read my post, hope someone can help:-)

johnMoss
05-31-2011, 10:31 PM
Haven't seen your code but as a general rule, each has to have their own script call in the header and each shall be uniquely identified... Think of it like this:
If you want to play 2 movies, you need two VCR players...

DeeryMe
06-01-2011, 07:18 AM
Thanks for the response but I am sill not clear..

What I have done is -
gave the image an id as 'rotator' then added a 'swap image' behavior,
inserted this code into script -

// Comma separated list of images to rotate
var imgs = new Array('images/1.jpg','images/2.jpg','images/3.jpg','images/4.jpg','images/5.jpg');
// delay in milliseconds between image swaps 1000 = 1 second
var delay = 5000;
var counter = 0;

function preloadImgs(){
for(var i=0;i<imgs.length;i++){
MM_preloadImages(imgs[i]);
}
}

function randomImages(){
if(counter == (imgs.length)){
counter = 0;
}
MM_swapImage('rotator', '', imgs[counter++]);
setTimeout('randomImages()', delay);
}

then amended code into body to say
<body onload="preloadImgs();randomImages();">

my problem is i want to do the same to another image... I have given another image id as 'rotator2', but i don't know what code to insert for showing the new rotating images.... hope this makes sense?:-)

johnMoss
06-01-2011, 03:16 PM
All you need to do is copy everything you've just done, and simply create a new object and function to play with. You can name them whatever, but I'm simply adding a 1 to existing calls. To wit:

Create a new array, call it imgs1 & specify the array images.
Create a new function, call it randomImages1.
Call it in the body as you did the other; you're set...

johnMoss
06-01-2011, 03:17 PM
Also, sorta goes without saying, but make sure the images are optimized as much as possible, This page can get really slow quite easily...

DeeryMe
06-01-2011, 06:03 PM
Ok, I am going completely mad....

Firstly a huuuuuge thank you for helping me but i am totally rubbish at this, being very determined but think I am near calling quits..

I am very unfamiliar with this scripting and having a go, maybe by showing you on my page http://secretwardrobe.co.uk/NewPics/newpage.html might help?

I have now got two lots of rotating images but unfortunately they are both rotating to the first array and not the second, I do want to do a third set but maybe next year lol - any ideas?

xx

johnMoss
06-01-2011, 07:10 PM
They are equivalent right now because your second function is inheriting the speed from the first object class. Take a look at your code; you see where you have declared the speed at 3 seconds? In the absence of a new declaration, it's taking that one by default, as no specific object has been declared, it assumes all henceforth. Remember, each piece of scripting needs to be totally separate from the other, or they will work in conjunction where new (specific) object rules are not declared.

DeeryMe
06-01-2011, 07:50 PM
Thanks, but think i am throwing the towel in, keep doing something wrong whatever I try ;-(

Just found this and think i might start again - http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

Thanks again for your time!

johnMoss
06-01-2011, 10:08 PM
Dynamic drive is an excellent resource, and yes, will make life a lot easier... :)