Closed (works as designed)
Project:
Flex Slider
Version:
7.x-1.0-rc2
Component:
Miscellaneous
Priority:
Normal
Category:
Support request
Assigned:
Unassigned
Reporter:
Created:
8 Apr 2012 at 23:34 UTC
Updated:
18 Apr 2012 at 23:41 UTC
I have a strangeness showing up on the slider being used on the homepage of my new site at cambslines.ivimey.org. If the browser window is "normal" width, it displays reasonably. However, if I widen the window, wider than the original images, the slider images start behaving badly, jumping around, not resizing and generally icky!
The context they're in: the theme is a very plain Omega Starterkit HTML5 theme using a default 960px wide Responsive config. The flexslider options are pretty basic: slide interval 10s, loop, playback, anim: fade, no controls. The slider is reading images from a multi-value Image field which is being fed into the omega Branding region using nodeblock.
Any ideas why it's not behaving nicely?
Comments
Comment #1
Nathan005 commentedthis is a css issue, not an issue with the module
first make sure you said in the image styles to allow upscaleing.
what appears is happening it that your ul is getting the correct width for a moment then scaling down to the contained width.
since you have a float left on the slide jumps to the left and then back to the right when the ul scales down
(to the right because you have the nav container floated right and enclosing the div of the flexslider container)
It appears you didn't edit any of the default css of the flexslider - you can
there are lots of ways to fix this -
The easiest fix is to load large images and then they will scale down fine
another easy method you could set a fixed width on just the large omega stylesheet (I believe its default-wide)
the other way is css trial and error, have fun! (use firebug or similar)
Also your nav-container is smaller than your slideshow causing your flexslider to be off on the right
Comment #2
minoroffense commentedI'm not sure if this is an issue with the module or the library. You might try increasing the size of the images (or looking into the Adaptive Image Styles module).
As for debugging this, I would say setup a plain HTML page with just the flexslider library enabled with the same size images. See if it reacts the same way. If it does, then I would suggest posting a bug to the Flex Slider project.
Try that out, let me know how it goes.
Thanks!
Comment #3
rivimeySorry I didn't reply quickly: only just found time to do this bit again.
It does, though the size was set to 1024x240. Given that this module is all about flexible size, it is really unclear to me what settings are appropriate for size. I would expect "original size" to be the best, so that no rescaling takes place to degrade the image before Flexslider gets its hands on the image (assuming the original size to be within a ballpark of reasonable). Original size was 960x240, to match the supposed 960 width of a normal-width page in this theme. I was expecting Flexslider to scale up and down...
I have sorted the thing with the float, which was unintentional, so it's now always left-aligned and left-float, and it's now more stable. I'm not convinced it is working right though. For example, why is the RH white border larger than the 4px the flexslider css defines: I can't see any override for it.
I think I am misunderstanding the nature of flexslider resizes...
For example , is there a way to enable non-aspect-ratio preserving resizing?
I think i should indeed reupload the pics somewhat larger.
Thanks for looking and for your help
Ruth
Comment #4
minoroffense commentedGreat to see people helping one another. I'm going to close this for now. Feel free to reopen if you want to continue the conversation.