[A user found this problem, and I'm putting it here for discussion.]

========================================

I have installed the latest version of this module in Drupal 7 following the instructions; I have created a new content type with "Supersized Slide" field, and added the images.

I see a fullscreen background, but I can't make the image fit the hole screen correctly without getting stretched.

I have tried changing the Supersized Dimension settings without any luck. At the moment this are my settings:

-------------

Minimum width : 0
Minimum height : 0
Always fit * YES

Fit portrait * Yes

Fit landscape * No

-----------

========================================

CommentFileSizeAuthor
#2 SUPERSIZED.jpg383.33 KBeidoscom
#1 Captura2.JPG26.71 KBsincronista
#1 Captura.JPG39.13 KBsincronista

Comments

sincronista’s picture

StatusFileSize
new39.13 KB
new26.71 KB

Thanks ahlofan for posting my issue.

So this are my settings at the moment (I have tryed different combinations, without any luck...)

supersized

And this is my result (the image does not fit the full height of the screen...)

supersized

What is it that I am missing?
Thanks

eidoscom’s picture

StatusFileSize
new383.33 KB

I has the same problem. In my case, there are a "set" of photos and checked Yes for "Always fit", "Fit portrait" and "Fit Landscape".

It is so strange because the first two photos of the slide is not resizing properly but the other ones get the correct fit. Moreover, the two slides that is not resizing resizes ok depending the "proportion" of the navigator window. I attached a picture to see the result.

I don't know if the problem is related to the module or directly to the supersized script...

Any help?? Thanks

ahlofan’s picture

Hi, thanks for pointing this out. There is actually an image style "supersized" comes with this module. This is the default image style for the supersized slides.
The first thing it does is to scale and crop image to 1920x1080, so that it fits most of the desktop monitor, and then it converts the image into jpg, with 100% image quality. This is to prevent the image filesize being too large, but with decent quality.

You could either modify this image style (admin/config/media/image-styles/edit/supersized) or to create a new image style and change the settings in your field display panel (admin/structure/types/manage/YOUR_CONTENT_TYPE/display).

Enjoy!

eidoscom’s picture

It is not sloving my problem.

I'm trying to figure what's happening on this behavior.

In my case, when the browser window is portrait (height more than width), photos that are landscape shows streched, but when the browser window is landscape, the photos shows well.

As I said earlier, it only occurs with the two first photos of the slideshow.

I monitored the function in wich the photos are resized (base.resizeNow = function(){), and the browser window detected and found some "strange" or almost not understanding results:

  1. Almost the first of this function calls generates a set of values where width and height of the browser are not defined.
  2. Almost the first of this function calls generates a set of values where width and height of the image are not defined.

As a consequence, no ratio are calculated and thinking about some CSS rule that determines the final aspect...

eidoscom’s picture

Weird!!!!!!!!!!!!!!!!!!!!

If i remove the CSS img max-width:100% all is working well .... a couple of days looking for it .... hope this can help someone ;)

ahlofan’s picture

eidoscom, thanks for finding this out, but may i know where you found this max-width css property? It's from Supersized! js library or your theme?

eidoscom’s picture

The max-width css property is from my theme. I think this property is common to all adaptive themes.

I create a rule like this:

#supersized {
    img {
        max-width: none !important;
        }
}

Perhaps can be a good idea adding this to the default CSS from the module?

Almost it can be a selectbox or a warning ;)

eidoscom’s picture

Ups, this is a sass rule.
The normal rule must be:

#supersized img {
      max-width: none !important;
}
ahlofan’s picture

Status: Active » Closed (fixed)

thanks eidoscom.

i think will close this issue since it is more a theme specific issue.

eidoscom’s picture

It can be possible to add a warning on the readme.txt file to advice the people that are using it?? I think adaptivethemes are modern aproaches to layout a web and as I said earlier, the property max-width:100% is present in all or at least most of them.

Sorry for reopen this, and thanks

ahlofan’s picture

eidoscom, you are right, thanks for your suggestion. Few more new stuff rolling out, will include this :)