Inside the slideshow I have four fields (classes are defined below)

- Image (.views-field-field-homepage-slider-image)
- More info button (.views-field-field-more-info-link)
- Title (.views-field-title)
- Text (.views-field-field-homepage-slider-text)

I need the image and button to slide and the title and text to fade in and out. All elements need to be in sync.

I am looking for the way to define this inside the 'advanced options' box inside the views slideshow properties. If unable to do so inside the options then can add to my custom.js file.

Comments

dshields’s picture

dshields CreditAttribution: dshields commented

Has anyone tried to achieve this desired functionality?
I'm interested to know how we might be able to further extend the core functionality offered by Views Slideshow.

NickDickinsonWilde’s picture

NickDickinsonWilde
He/Him/His
Primary language English
Location Victoria, BC (T'So-uke lands)
CreditAttribution: NickDickinsonWilde at BriarMoon Design commented
Issue summary: View changes
Status: Active » Closed (outdated)

To do it as one slideshow would be impossible with the current implementation - just not supported with jQuery Cycle. Yes you could rewrite it to do that but it'd be so significant you'd probably be better to start fresh.
... Or:
Have four (or how ever many needed - maybe only 2 depending on position etc.) slideshows. Set them to do the right animation, start paused with all the same timing settings. Then start them all at oncen from your custom JavaScript. like:

Drupal.viewsSlideshowCycle.play({ "action": 'play', "slideshowID": "slideshow-page1"});
Drupal.viewsSlideshowCycle.play({ "action": 'play', "slideshowID": "slideshow-page2"});
Drupal.viewsSlideshowCycle.play({ "action": 'play', "slideshowID": "slideshow-page3"});
Drupal.viewsSlideshowCycle.play({ "action": 'play', "slideshowID": "slideshow-page4"});