We're a community of 1076K IT Pros here for help, advice, solutions, professional growth and fun. Join us!
1,075,737 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Start New Discussion Reply to this Discussion

Fade+Slide=Help

Can anyone write a simple code for a slider that fades???? i want to do one just like the one on mbusa.com.... can anyone assist???

Thanks in advanced!

5
Contributors
11
Replies
1 Day
Discussion Span
9 Months Ago
Last Updated
12
Views
Question
Answered
<M/>
Senior Poster
3,611 posts since Apr 2012
Reputation Points: 64
Solved Threads: 77
Skill Endorsements: 90

Check out jQuery cycle. It is a jQuery library for slideshows with a variety of transitions. It is pretty easy to set up too.

hericles
Veteran Poster
1,065 posts since Nov 2007
Reputation Points: 156
Solved Threads: 228
Skill Endorsements: 9

thanks for that info, but I don't want a plugin... I want to do it purely of html5 and css3... and very little JQuery :)

<M/>
Senior Poster
3,611 posts since Apr 2012
Reputation Points: 64
Solved Threads: 77
Skill Endorsements: 90

pretty sure you are still going to need at least JavaScript. jQuery is just a JavaScript library to make it easier to do client side processing.

if you take a look at the page source on mbusa.com, you'll find quite a bit of references to jQuery and JS scripts.

JorgeM
Industrious Poster
4,002 posts since Dec 2011
Reputation Points: 294
Solved Threads: 543
Skill Endorsements: 115

I know I'm gonna need it, but I don't want to write too much of jqeury... So you have any possible solutions... source codes? sites? tutorials? anything?

<M/>
Senior Poster
3,611 posts since Apr 2012
Reputation Points: 64
Solved Threads: 77
Skill Endorsements: 90

Again you should check out jquery cycle. Beyond adding the libraries and correctly naming the divs on the page there is one script (a couple of lines) that you need to add to the page to set it all in motion.

hericles
Veteran Poster
1,065 posts since Nov 2007
Reputation Points: 156
Solved Threads: 228
Skill Endorsements: 9

But what if I wanted to create it myself? I don't want to have the troubles of a plugin because I want maximum control... so you have any sources but thanks for that fact...

<M/>
Senior Poster
3,611 posts since Apr 2012
Reputation Points: 64
Solved Threads: 77
Skill Endorsements: 90

If you wish for a basic fading effect, I may have a way to do it.
1. Use jquery to set the z-index of the pictures.
2. use fade() and reappend the image behind the last one while decreasing z-index of all pictures during the effect.

lps
Posting Whiz in Training
208 posts since Jul 2011
Reputation Points: 13
Solved Threads: 43
Skill Endorsements: 3

Can you write a snippet of code? I am learning bits and bits of jquery while I learn php/mysql

<M/>
Senior Poster
3,611 posts since Apr 2012
Reputation Points: 64
Solved Threads: 77
Skill Endorsements: 90

Here's a demo I wrote a while back (zip and demo available).

pritaeas
Posting Prodigy
Moderator
9,265 posts since Jul 2006
Reputation Points: 1,173
Solved Threads: 1,456
Skill Endorsements: 86

Thanks for the resource :)
Problem with the jquery file is that when I open it gives me a massive document (jquery-1.4.2.min.js)... is this supposed to happen?

<M/>
Senior Poster
3,611 posts since Apr 2012
Reputation Points: 64
Solved Threads: 77
Skill Endorsements: 90

Instead of hosting your own jQuery file, it makes more sense to reference it from a CDN. The reason is that more than likely, a visitor has already downloaded the jQuery file and has it cached. When the visitor accesses your site, downloading jQuery will not be necessary.

Read more..
http://docs.jquery.com/Downloading_jQuery

JorgeM
Industrious Poster
4,002 posts since Dec 2011
Reputation Points: 294
Solved Threads: 543
Skill Endorsements: 115
Question Answered as of 6 Months Ago by hericles, JorgeM, lps and 1 other

This question has already been solved: Start a new discussion instead

Post: Markdown Syntax: Formatting Help
 
You
 
© 2013 DaniWeb® LLC
Page rendered in 0.1169 seconds using 2.76MB