jQuery How to mix jQuery Features and JavaScript ..

[Vrutin]

Hello, I created this basic slideshow in JavaScript. That can go next, previous, first and last.

Now, its pretty simple and there is no animation.

Could I use jQuery features like fadein and so on in my current script?

// Slide Show Previous, Next , First & Last

var min = 1;
var last = 5;

var current = min;

function moveSlide(moveMe) {
	if (moveMe == 0) {
		current = min;
	}
	current = current + moveMe;
	if (moveMe == "end") {
		current = last;
	}
	if (current > last) {
		current = min
	} else if (current < min) {
		current = last;
	}
	document.getElementById("img1").src = "images/slide" + current + ".png";
}

Do I need to add the jQuery Lib in this current custom.js file?

Thanks in advance

[VIPStephan]

Fading is not specific to jQuery, you can create your own fade animation (you just have to kinda reinvent the wheel). Basically you set up an interval (setInterval()) during which you decrease and increase the opacity of the image sequentially. But of course, you could just add jQuery and use that one. After all, jQuery is just JavaScript, too.

Note, however, that with your current set-up you can only fade out and in subsequently, not simultaneously/seamlessly since you’re just changing one image’s source attribute value. You need to fade out the image, change the src value and then fade in again.

[Vrutin]

Here's how I am thinking to do this:

When the slider area loads, it fades into first image..

Then every time there is a click on next || previous || first || last..

it fades into that image...

that would create the fade in effect ..

Please correct my understanding if I am thinking wrong.

Thanks

[Vrutin]

I am just playing with the ideas.. However, the following code is not executing.. any reasons why?

// left is the division where the slideshow resides
$("#left").ready( function() {
	
	$("#1").show("fade", 1000); // 1 is the image ID
	
});

Thanks

[felgall]

Originally Posted by VIPStephan

Fading is not specific to jQuery, you can create your own fade animation (you just have to kinda reinvent the wheel).

You don't even need to do that.Just go to http://www.brothercake.com/site/reso...s/transitions/ and grab the transitions JavaScript library from there. It has all sorts of different fades built in.