jQuery Forum

I am using the cycle plugin, I have 4 images of diffrent sizes, Upon th epage load all the imges displayed as stacked, once the 1st cycle has completed the slideshow behave as expected. How do solve the initial stack display, thx. here is the code

 

body {
 background: rgb(50,50,50);
}

#myslides {
position:relative;
    height:480px;
    padding: 0;
    margin:  0 auto;
}

#myslides img {
    position:absolute;
    padding: 10px;
    border:  1px solid rgb(100,100,100);
    background-color: rgb(230,230,230);
    overflow: hidden;
    top:  0;
    left: 0;
    z-index: - 1
}

 

$('#myslides').cycle({
    fx:      'custom',
    cssBefore:{ 
        left: 0,  
        top: 0, 
        display: 'block',
        zIndex: 1 
    },
    animIn: { 
        left: 0,
        top: 0,
        opacity: 10
    },
    animOut: { 
        left: 232,  
        top: 232,
        opacity: 0,
        zIndex: 0
     },
    cssAfter: {
        zIndex: 0
    },
    delay: -1000
});