Register FAQ / Rules Forum Spy Search Today's Posts Mark Forums Read
Go Back   MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Reply
 
Thread Tools Search this Thread Display Modes
Old May 21, 2013, 08:50 PM   #1
macaddict23
macrumors 6502
 
Join Date: Jun 2006
Location: MacVille, USA
I'm looking for a specific carousel-style slideshow

Here's what I want to happen:

- I'd like to create a carousel-style slideshow out of five banner images
- I'd like the slideshow to play automatically, but I also want the user to click/jump to any of the banners via a series of clickable dots
- In banner #1, I would like a fade transition to happen within the banner itself. Is this possible?

Thanks,
Mark
__________________
Think Different.
macaddict23 is offline   0 Reply With Quote
Old May 22, 2013, 04:23 AM   #2
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
Quote:
Originally Posted by macaddict23 View Post
Here's what I want to happen:

- I'd like to create a carousel-style slideshow out of five banner images
- I'd like the slideshow to play automatically, but I also want the user to click/jump to any of the banners via a series of clickable dots
- In banner #1, I would like a fade transition to happen within the banner itself. Is this possible?

Thanks,
Mark
jQuery carousel plugins are one way.

For a carousel with user interaction, clickable dots and a myriad of custom configuration options including transition effects, check out this one and be sure to look closely at the configuration options for complete customization including transitions which is a simple matter of also using the JQuery.transition-plugin linked in the config area.

This is a pretty amazing script - it has callbacks, triggers and complete customization using jQuery -- cross browser compatible and easy to config.

Get the basic carousel working first, all 5 slides.

For the fade effect only on slide #1 only this carousel conveniently includes callback functions as custom events for each HTML element in each slide referenced by "this". The configuration options and event triggers are well documented and plentiful which is why I chose this one for you. Add a condition to check for slide 1 and do a normal JQuery fade within that condition.

Obviously doing the slide #1 thing requires basic knowledge of Javascript, callback functions and jQuery. Documentation and examples all over the site and at jQuery.com.

Cheers.

__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com
SrWebDeveloper is offline   1 Reply With Quote
Old May 28, 2013, 05:36 PM   #3
macaddict23
Thread Starter
macrumors 6502
 
Join Date: Jun 2006
Location: MacVille, USA
Thanks for the leads. Right now, I'm using WowSlider, which looks like it might work. Is it possible to have multiple transition times between slides. So instead of a global 2-second transition between each slide, I would like a 5 second transition between Slide 1 and Slide 2, and everything else be 2 seconds.
__________________
Think Different.
macaddict23 is offline   0 Reply With Quote
Old May 29, 2013, 11:36 AM   #4
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
Quote:
Originally Posted by macaddict23 View Post
Thanks for the leads. Right now, I'm using WowSlider, which looks like it might work. Is it possible to have multiple transition times between slides. So instead of a global 2-second transition between each slide, I would like a 5 second transition between Slide 1 and Slide 2, and everything else be 2 seconds.
Yes, it is possible to make any carousel behave this way, slide by slide.

Can't speak for WowSlider - but if in its configuration you cannot easily do what you want (which is different than your original request which makes helping you rather difficult, TBH) the basic procedure I outlined in my previous response will work here, i.e. targeting slides by ID with JQuery and adding conditional effects. I am not sure if you're expecting us to code the solution for you or not or if you are hoping a widget out there does exactly what you want with simple setup --- but the widget and its API I suggested originally *will* allow you to do literally whatever you want to any slide in any manner.

__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com
SrWebDeveloper is offline   0 Reply With Quote
Old May 30, 2013, 04:30 PM   #5
macaddict23
Thread Starter
macrumors 6502
 
Join Date: Jun 2006
Location: MacVille, USA
Sorry for the confusion. I'm not expecting anyone to code it for me. I'm looking for an existing code (free or purchase) that would allow me to cycle several images on my homepage. Just a very simple image swap or a fade-in. It would also be nice to have the ability to set multiple delay times between slides.

I have no knowledge of javascript or JQuery. :-(
__________________
Think Different.
macaddict23 is offline   0 Reply With Quote
Old May 31, 2013, 01:54 AM   #6
SrWebDeveloper
macrumors 68000
 
SrWebDeveloper's Avatar
 
Join Date: Dec 2007
Location: Alexandria, VA, USA
 
Quote:
Originally Posted by macaddict23 View Post
Sorry for the confusion. I'm not expecting anyone to code it for me. I'm looking for an existing code (free or purchase) that would allow me to cycle several images on my homepage. Just a very simple image swap or a fade-in. It would also be nice to have the ability to set multiple delay times between slides.

I have no knowledge of javascript or JQuery. :-(
Respectfully, this is the third different request, but at least now I know you're not a developer which explains alot. Unfortunately the forum you're on now is for developers so the advice was given directed to folks who know basic Javascript or frameworks like jQuery which extend Javascript to make things easier for a developer. Even if I find you a plugin that is perfect, you still need to know how to install it (HTML), configure it (Javascript) and customize it (CSS) --- as basic as it gets.

If what I said is like a foreign language to you, hire a developer.

If you are willing to learn the basics - this plugin is as basic and easy for beginners to install and configure, just follow the directions:

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

And I even found a tutorial for this plugin for beginners: http://digitalunion.osu.edu/2011/10/...ttle-tutorial/

The rest is up to you!

Note: Others here might post simple Javascript solutions but I warn you, you're asking for fade and transition effects not just simple rotation, so the reason I suggested the plugin is to simplify the customization part. And, technically, the jQuery framework handles cross-platform browser compatibility issues and stuff you'd rather not learn nor need to learn. I figure you might as well learn jQuery instead of dealing with all those other issues in standard Javascript.

Hope this helps you, no matter how you proceed from here. My job is to inform you of the facts as I see them, feel free to wait on other replies if you want more feedback and more ideas for scripts. Good luck to ya.

__________________
Jim Goldbloom
Sr. Web Developer, owner GoldTechPro, LLC
http://www.GoldTechPro.com
SrWebDeveloper is offline   0 Reply With Quote

Reply
MacRumors Forums > Special Interests > Visual Media > Web Design and Development

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
thread Thread Starter Forum Replies Last Post
Dropbox Announces 'Carousel' Photo and Video App, Mailbox for Desktop MacRumors MacRumors.com News Discussion 74 May 5, 2014 11:36 AM
Very odd problem: Wifi speed issue with a specific network in specific part of room?! Arjun Jethwa MacBook Air 2 Jan 31, 2014 03:41 PM
Beyonce Releases Exclusive iTunes Album, Dominating Store Carousel MacRumors Mac Blog Discussion 71 Dec 17, 2013 09:43 AM
An iPad Slideshow App-Photo Slideshow Director HD socusoft12 iPad Apps 5 Mar 19, 2013 08:44 PM
Slideshow VStenger MacBook 0 Jul 30, 2012 04:37 PM

Forum Jump

All times are GMT -5. The time now is 01:05 PM.

Mac Rumors | Mac | iPhone | iPhone Game Reviews | iPhone Apps

Mobile Version | Fixed | Fluid | Fluid HD
Copyright 2002-2013, MacRumors.com, LLC