.field-slideshow-slide, .field-slideshow-slide a, .field-slideshow-slide img {
  max-width: 100%;
  height: auto !important;
  width: auto !important;
}

If I comment these lines in field_slideshow.css the effects start to function properly.

The bug is this (the intended behaviour was a scrollLeft, but I think many others effects are affected):

Slider Bug

CommentFileSizeAuthor
#5 wrong_css_is_causing-2661500-4.patch537 bytesPrashant Singhal
slider bug.gif441.86 KBkopeboy

Comments

kopeboy created an issue. See original summary.

kopeboy’s picture

kopeboy
Primary language Italian
Location Milan
commented

UPDATE:
actually that didn't work either.

Only disabling those CSS rules in the Chrome inspector was working, but after having saved the css file and reloaded it wasn't working correctly either.

It's hard to show but the problem is that you will have the coming image appearing in the middle and not coming from the right.
I tried several css "fixes" but couldn't get it to work properly.

The closest to the right function was using this:

.field-slideshow-slide img, .field-slideshow-slide a {
  max-width: 100%;
  height: auto !important;
  width: auto !important;
}

that is, NOT applying those rules to the outer ".field-slideshow-slide".
But still.. the first image will grow/move down incorrectly on the first animation only. After a complete loop, even the first image will animate correctly :/

erik’s picture

erik commented

Put this in my themes' stylesheet (referenced here: https://www.drupal.org/node/2204781) and worked out well for me.

.effect-scrollLeft .field-slideshow-slide { width: 100% !important; }

(Only tested it yet in Chrome & FireFox on Os X; Can others confirm this is also working on other platforms?)

Prashant Singhal’s picture

Prashant Singhal commented
Assigned: Unassigned » Prashant Singhal
Prashant Singhal’s picture

Prashant Singhal commented
Assigned: Prashant Singhal » Unassigned
Status: Active » Needs review
StatusFileSize
new wrong_css_is_causing-2661500-4.patch537 bytes

Setting max-width property to 100% for the .field-slideshow-slide img css-selector confines the original image to its parent's height and weight which is not the expected behaviour in drupal 7 on selecting the image style as none(original image). So removing the max-width:100% does the job and image no longer grows and then scrolls; rather its scrolls as expected. To confine the images to consistent dimensions, use preset or custom image styles instead.

  • lamp5 committed 2ff3521 on 7.x-2.x authored by Prashant Singhal 
    Issue #2661500 by Prashant Singhal, kopeboy: Wrong CSS is causing slide...
lamp5’s picture

lamp5
Primary language Polish
Location Rzeszow
commented
Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.