Learn everything you want to know. Graphic and web tutorials.

In this tutorial I will show you how to add new functions to the DSlider (jQuery content slider), created in a previous video. First we will clean up the javascript file, then add a timer that will automaticly animate after a specified time, and finally we’ll make it controllable by the left and right arrow keys.

Related

hey mate
tell me plz
what to do when i want the slider to slide in vertical method
instead on horizontal side by side method
how to make it vertical slide
thanx a lot mateee

http://dimics.com Durgé

If you want it to slide vertical, take a look at the first vid. In the video first the slides ar vertical under each other. Use that and use the “top” to animate it.

banny

thnx my mate
ur tut are of gr8 help:)
looking fwd to see more from u mate
have a nice day

mikel

Hi I wanted to create a slide menu just like yours on the left hand side. when you hover to the menu it slides out can you tell me some please. Thank you.

mohan

hi
good tut from your side
thanks

Tai Tran

good tut , but i have some question i hope u will answer it :

1. i dont understand that var slides = $(‘#slides’).length
in the note that u wrote if(current==slides) this is last slide.

why? var slides = $(‘#slides’).length mean last?

http://dimics.com Durgé

val slides = $(‘#slides’).length counts all slides.
In the example this will be 3.

Since this is the total number of slides, the variable “slides” also is number of the last slide. If it’s the current, we need to animate to the first.

Tai Tran

oh ty i got that
I have 1 more question:)
1. in jquery code if(current == slides) this mean if (3==3)
i asked my friend he said current that counted 3 slides cuz depend on var slides = $(‘#slides’).length …
1.I dont know why this var current and var slides relative? i’m thinking now that var current shouldn’t know there are 3 slides expect var slides.. huh can u explain for me ?:]~

Tai Tran

except not expect

http://dimics.com Durgé

Because var current get’s updated every time the visible slide changes, look through the code, under the statements that animate the slide, there is some code to update the var current.

If the if statement returns “true”, the slider animated one time back(previous button was pressed), or was animated two times forward.

Just walk “debug style” step for step trough the code and you will see.

Tai Tran

oh !!~.~ that helped me.
thanks very much , but long time i don’t see any new tuts from ur site anymore? are u busying?

Gabriel

Is it possible to change the slider transition to a fading transition so that the new slides just fade into on another?

Hmm i took your code, made it vertical but there seems to be a problem in chrome. Might not have anything to do with your code but could you take a look at it? I guess you can see my email? if not let me know i can pm it or something.

PS: i think i noticed your dutch in the video, am too.

http://dimics.com Durgé

The “weird” javascript is from google analytics.
To track stats, views and so on.

I’ve seen your email, I can’t see an obvious problem.
I’m pretty busy right now, when I find the time I will take a closer look.

Yes we are Dutch xD..

http://dimics.com Durgé

@Gabriel

Everything is possible.. I don’t think my code is the easiest way to.

Maybe just align all slides ontop of each other, and then hide and make visible..

It wil take some hours of tying and frustration ;p
Or just download an other slider somewhere.

Good luck!

# Mohamed

Could you plz make tutorial about to make Jquery ScrollTo Like what you made in DiMics,
Thanks

Beny

@Durgé : Hi, Congratulations for your so simple slider !

Actually, I use DSlider with Shadowbox but I have a problem.
When I open an image (with Shadowbox), the slider in background keeps sliding… So when I close the Shadowbox I am in an other slide page. (I could locate in the Shadowbox code where to place a function that would stop the slide).

Would you have any idea how to stop the slider and then run it ?
(I tried with “Timer()”, “ClearTimer” (…) but it dosen’t works).

Thank you in advance !
Best

Beny

http://www.john-breek.com/Test Hans

Dear Durgé,

At first…. Thank you very much for your Dslider. I was looking for that a long time.
Do you have a solution if I want to make it liquid to fit in differnt screen sizes?
I appreciate it a lot, as I tried a lot with % in css.