Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • May 4, 2014 at 6:58 am #259888
    cyrusis

    Hi guys,

    I am shifting my homepage to a full screen slider setup. This will be for a photography website, meaning, I can’t afford to lose any resolution on my images.

    I’m using a monitor that is set to 1920 x 1080 resolution. So I have decided to make my photographs the same size (1920 x 1080). Now, when I upload my picture, I’m getting about 25% decrease in image quality in the slider. The image in wordpress’ upload section is kept at 1920 x 1080, I selected no automatic scaling in the editor, but I’m still losing this quality.

    Can you please advise me on how to keep my full resolution? I need these looking as sharp as they are in the second link.

    Many thanks!

    • This topic was modified 10 years, 7 months ago by cyrusis.
    May 5, 2014 at 10:14 am #260151
    Devin

    Hey cyrusis!

    The image you linked to is the actual image that is being used for the background. As in, in the code of the page the file is being displayed is that exact image.

    Best regards,
    Devin

    May 5, 2014 at 6:21 pm #260397
    cyrusis

    Hi Devin,

    I linked the same image so you can see the resolution issue I’m talking about (assuming you use 1920 x 1080 res.).

    I’m using 1920 x 1080 res. on my monitor, and that image is 1920 x 1080. I set it to no scaling, but enfold is still adjusting the image and ruining its quality by about 20%.

    I’m wondering why? I want to know the perfect size image to upload for a 1920 x 1080 screen without losing so much quality due to web resizing.

    May 6, 2014 at 6:49 am #260587
    Ismael

    Hey!

    Thank you for the update.

    The quality of the image on the fullscreen slider is the same exact quality that you have on the original image. The background-size of the full screen slider is set to cover in order to avoid image stretching and retain the correct proportion and ratio of the image. You can set it to 100% if you want but the background image will stretch depends on the screen resolution and it will definitely look ugly on smaller screens with wide resolution. The image size that you’re using is quite good but if you want to know, the demo uses images with 1500x1500px dimension for the fullscreen slider. You can add this on Quick CSS or custom.css if you want to set the background size to 100%:

    .avia-fullscreen-slider .avia-slideshow>ul>li {
width: 100%;
height: 100%;
background-size:  100% 100%;
background-position: center center;
}

    Cheers!
    Ismael

    May 6, 2014 at 9:29 pm #260941
    cyrusis

    Ok thanks guys.

    Maybe it’s because I use a 26 inch monitor. Either way, thanks again for the help.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Full screen slider and image resolution issues.’ is closed to new replies.