$(function() {
$('#s1').cycle({
    fx:      'scrollHorz',
    click:   '#s1',
    timeout:  15000,
    easing:  'backinout',
    next:   '#kolejny',
    prev:   '#poprzedni'
});

$('#s2').cycle({
    fx: 'custom',
    easeOut: 'backin',
    easeIn: 'bounceout',
    after: onAfter2,
    speed: 800,
    timeout: 3,
    cssBefore: {  
        top:  0, 
        left: 0, 
        width: 326,
        height: 0,  
        zIndex: 1  
    }, 
    animIn:  {  
        width: 326,
        height: 282
    }, 
    animOut: {  
        top:  0,
        left: 0,
        width: 326,
        height: 0 
    }, 
    cssAfter: {  
        zIndex: 0  
    },
    delay: 0
});
$('#s3').cycle({
    fx: 'custom2',
    easeOut: 'backin',
    easeIn: 'bounceout',
    after: onAfter3,
    speed: 800,
    timeout: 3,
    cssBefore: {  
        top:  0, 
        left: 0, 
        width: 344,
        height: 0,  
        zIndex: 1  
    }, 
    animIn:  {  
        width: 344,
        height: 282
    }, 
    animOut: {  
        top:  0,
        left: 0,
        width: 344,
        height: 0 
    }, 
    cssAfter: {  
        zIndex: 0  
    },
    delay: 0
});

$('#s4').cycle({
    fx: 'custom3',
    easeOut: 'backin',
    easeIn: 'bounceout',
    after: onAfter4,
    speed: 800,
    timeout: 3,
//    end: onEnd,
//    nowrap: 1,
//    autostop: 1,     // true to end slideshow after X transitions (where X == slide count)
//    autostopCount: 2,     // number of transitions (optionally used with autostop to define X)
    cssBefore: {
        top:  0,
        left: 0,
        width: 308,
        height: 0,
        zIndex: 1
    },
    animIn:  {
        width: 308,
        height: 282
    },
    animOut: {
        top:  0,
        left: 0,
        width: 308,
        height: 0
    },
    cssAfter: {
        zIndex: 0
    },
    delay: 0
});
function onAfter4() {

    $('#s4').cycle('pause');

}

function pozycjaMyszy(e) {
}
function onAfter3() {
    $('#s3').cycle('pause');
}
function onAfter2() {
    $('#s2').cycle('pause');
}
});