Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #11830

    I am using Aviaslider on a single page of my wordpress driven site. Every time after a transition it resizes the image smaller (313×616), creates a border around it and leaves white space in the slider area on the right and bottom sides. I am using the default values in the scripts and css. The scripts are being called in the entry-content for the page. I checked to make sure my lightbox plugin wasn’t creating a conflict, which it wasn’t. Any ideas what could be causing this to happen?

    #73231

    Hey esternullo,

    Do you have the site live where we can take a look at whats going on? Just from your description i’m not sure what is going on.

    Regards,

    Devin

    #73232

    No, I have been working on it offline since I can’t take down the current website until this one is working. I will have to figure out some way to get it live since every attempt I make at fixing it only makes things worse. I started over with fresh scripts this morning and it broke my layout, doesn’t display slides, or transition anything.

    I will have to get it live somewhere, cos I am at my wits end on this. Can I just dump my local wordpress folder in another server folder to get it running? otherwise I will have to backup a separate wordpress server I already have running and swap it there temporarily.

    #73233

    Please check if you changed the image dimensions in style.css – search for following code and adjust the width/height value:

    .aviaslider{
    height:320px; /*this changes the height of the image slider*/
    width:640px;
    overflow: hidden;
    position: relative;
    background: #fff url(../images/layout/preload.gif) center center no-repeat;
    }

    #73234

    I have the site live here:

    http://www.esternullo.com/

    I changed the size of the slider window, but no matter what size the images are inside, it resizes them to a specific width it seems like.

    .aviaslider{

    height:320px; /*this changes the height of the image slider*/

    width:908px; /*changed from original size: 640px*/

    overflow: hidden;

    position: relative;

    background: #fff url(../images/layout/preload.gif) center center no-repeat;

    margin-top:-108px; /*cheated to cover up invisible heading*/

    }

    #73235

    Hi!

    Try to add following code to the stylesheet:

    .aviaslider img, .aviaslider a img, .aviaslider a {
    border: !important;
    min-height: 320px;
    min-width: 908px;
    }

    Best regards,

    Peter

    #73236

    that fixed the image resize issue, but the border is still there. once the transition is done, the image shifts so the border is visible on the top and left sides.

    this reduced the side of the border a little bit, but didn’t get rid of it all.

    .aviaslider img, .aviaslider a img, .aviaslider a {

    border: none !important;

    min-height: 320px;

    min-width: 908px;

    }

    #73237

    Hi!

    Try following code instead:

    .aviaslider img, .aviaslider a img, .aviaslider a {
    min-height: 320px;
    min-width: 908px;
    }

    .aviaslider img, .aviaslider a img, .aviaslider a, .aviaslider li, ul.aviaslider {
    border: none !important;
    padding: 0 !important;
    }

    Best regards,

    Peter

    #73238

    it still has the border on the top and left sides after the transition.

    #73239

    Hi!

    Actually it’s a padding and not a border. I adjusted the code above a bit.

    Regards,

    Peter

    #73240

    thank you! that fixed it for me.

    #73241

    Hi,

    Glad that this was resolved. :)

    Cheers,

    Ismael

Viewing 12 posts - 1 through 12 (of 12 total)

The topic ‘Aviaslider Resizing images after transistion’ is closed to new replies.