Fails in Slideshow in views

I am seeing the same issue. Created a content type of "Background Image", added the image style that was set to the default adaptive sizes. Then in Views, using the View Slideshow style and the image field set to the adaptive style again. The image displays at original size.

I'm having the same problem. While I have views slideshow installed, I'm not using it with an adaptive style. Uninstalling Views Slideshow does not fix the problem.

Nonetheless, I can't get the new re-sized image to render out. I see that the module creates the the folder structure with an image in the folder with the size it should be, but the image is the same dimensions and size as the original.

I get this error when it tries to load a new size image
Notice: Undefined index: effect callback in image_effect_apply() (line 1159 of /../../drupal/modules/image/image.module).

In fact it fails in Views even aside from Views Slideshow style.

I am having the same issue. When I enabled my adaptive image style in my Views Slideshow view, I also got:

Notice: Undefined index: effect callback in image_effect_apply() (line 1159 of /modules/image/image.module).

** This only occurs for me when using Views Slideshow with the JQuery cycle plugin and the same defined responsive image works fine in a node page view . If my view is set a regular view with an unordered list, the scaling of the image works fine. Removing this image style from my view also removes the error message.

I believe I have found a fix for this. It has to do with Views Slidshow putting fixed widths as inline styles which ultimately need to be overridden.

See http://drupal.org/node/1317510#comment-5514278

It would be good for others to try this out. I ended up finding the issue as I had tried all possible adaptive style image modules for Drup[al and was having the same exact issue with everyone so I figured it could not be module specific but in fact how Views Slideshow itself puts in the inline styles.

Just tested the latest Version using a fluid theme.
* Resizing on node page worked as expected.
* Resizing on Views node view worked as expected
* Resizing on Views list view worked as expected
Switching this to feature request.

#5 seems to be a valid solution, but I'm unsure whether to include the additional CSS per default into this module.
After all it could possibly break peoples slideshows.

Again the fix for posterity:

.views-slideshow-cycle-main-frame-row {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
}

Any opinions?

#6 worked for me but only with slide transition effects that work horizontally - vertical transition effects produce the next slide under the first, which then moves up into position. This doesn't look very good as the page is resized while the transition is taking place.

EDIT: My resizing problem is solved by unchecking the 'Make the slide window height fit the largest slide' in Slideshow settings. Doh.

following. I'm been grappling with the exact same issue.

#6 doesn't work for me with fade and some other effects. But using "absolute" instead of "relative" in css helps.

.views-slideshow-cycle-main-frame-row {
  position: absolute !important;
  width: 100% !important;
  height: auto !important;
}

Have someone tested it with field_slideshow module? Maybe the same problem. Seems not resize the image properly, too...

css workaround *seems* to work for me.

After experimenting / developing / designing Drupal sites with responsive designs over the last number of months, I've realized (Since my comment above in #4 /#5) that this is sort of like trying to fit a square peg in a round hole. I discovered the Flexslider Module (http://drupal.org/project/flexslider) which seems to solve all this. I am using it in an Omega sub-theme I designed and it "just works", the images resize brilliantly in my Views Slideshow. I think this module (Adaptive Image) is awesome / brilliant for images in static Nodes / Views so I think it's a case of "use the right tool for the right job" as my uncle always told me. Just my 2 cents...

#16 is confirmed to be working for me too. Good work!

Not sure if this was patched yet as it wasn't working for me until I applied this CSS.

Was starting to feel like there wasn't a solid solution to responsive/adaptive image slideshows. I used Views Slideshow and this (Adaptive Image) module to get an image slideshow that just works.

Unfortunately, I came across a weird issue. Since it's relating to Views Slideshow, I'm going to post it here if that works.

When the browser is resized manually, the height of the slideshow stays the same height while only the images themselves resize. This is 'fixed' when the page is refreshed, but if I need to show prospective clients the site, they'll assume this is a bug when they manually resize the browser.

Here are examples of the mobile and original size of the browser resizing:
Mobile: http://cl.ly/Go2C
Original: http://cl.ly/GoMs

This is the div that stays the same height (in my case 319px) depending on the image style/size I believe:
.views-slideshow-cycle-main-frame

Any fixes?

@chrishrtmn, your issue is definately a views slideshow issue. See #1146566: Can't remove the height/width of the slide container

You need to do the following

1. Created directory called json2 in sites/all/libraries and download https://raw.github.com/douglascrockford/JSON-js/master/json2.js and rename the folder json2.

2. Under FORMAT slideshow settings in the view, scroll "jQuery Cycle Custom Options" and under advance options select containerResize and set the value to 0 > hit "Update Advanced Option". Also add slideResize to 0 > 'Update Advanced Option".

3. Update the view and voila!

Very nice! Thanks for this quick fix. *thumbs up*

On your view, find 'Format: Slideshow | Settings'

Then under 'Advanced Options', change containerresize etc...

I think I'm having the same issue as mentioned in comment #7. But if I uncheck the 'Make the slide window height fit the largest slide' setting, my slides collapse and are no longer visible at all! Also setting the "jQuery Cycle Custom Options" doesn't do anything either, although I'm already setting .views-slideshow-cycle-main-frame-row with 'width: 100% !important;'

Attached a screen shot with my problem...

Seems to be a styling issue.

@nicoz thank you for your code. The slide can resize on browser's width.

One issue, the div wrapper of the slide collapsed.

Is there a workaround?

One issue, the div wrapper of the slide collapsed. Is there a workaround?

Not that I was able to come up with. I eventually stopped using views slideshow completely in favor of flexslider for this very reason. Views slideshow (more specifically jquery cycle v1) was in existence long before adaptive/responsive design was even conceived. Therefore it actually took hack-upon-hack to get it to eventually just sort-of work. IMHO, save yourself the headache and switch.

Furthermore, I also stopped using the Adaptive Image module in favour or the Picture module https://drupal.org/project/picture , which is the backport of the D8 responsive image solution. It more closely aligns with the W3C spec on responsive images and will allow you an easy upgrade to Drupal 8 later.

@nicoz Thank you for the recommendation and advice.

My article's Picture is working accordingly. (So, I know my Picture & Breakpoint are properly setup).

I am on Omega 4. I've installed Flexslider, picture and breakpoint. Now, the width of flexslider is stretched to the browser's width. Any idea why?

Update: Here is a thread on my issue. https://drupal.org/node/1927818

@jessicakoh. Sorry, I don't want to hijack this thread any more than we already have with issues relating to other modules. To quickly answer your question, you need to set a css max-width for your flexslider. The way flexslider works is that it fills up the width of the parent div, not wrap to the dimensions of the image.

more info