Slider full page, et transition.....

razor7
Javascript

Salut !

Alors voilà, je viens de terminer mon slider full page, il marche avec un fadeout et un fadein...., je n'arrve pas à faire mieux pour les transitions c'est pour cela que vous demande des conseils....
Le code js ne fait que quelques lignes (je n'ai pas mis le css et le html mais n'hésitez pas à me le demander) :
[code]
<script src="jquery.js"></script>

<script>
function redimensionnement(){ 

var $image = $('img.superbg');
var image_width = $image.width(); 
var image_height = $image.height();     

var over = image_width / image_height; 
var under = image_height / image_width; 

var body_width = $(window).width(); 
var body_height = $(window).height(); 

if (body_width / body_height >= over) { 
  $image.css({ 
    'width': body_width + 'px', 
    'height': Math.ceil(under * body_width) + 'px', 
    'left': '0px', 
    'top': Math.abs((under * body_width) - body_height) / -2 + 'px' 
  }); 
}  

else { 
  $image.css({ 
    'width': Math.ceil(over * body_height) + 'px', 
    'height': body_height + 'px', 
    'top': '0px', 
    'left': Math.abs((over * body_height) - body_width) / -2 + 'px' 
  }); 
}

}

$(document).ready(function(){

// Au chargement initial   
redimensionnement();

// En cas de redimensionnement de la fenêtre
$(window).resize(function(){ 
    redimensionnement(); 
});

});
</script>

<script>

$(document).ready(function(){

var $fs = $('#fullscreen'); // on cible le bloc du carrousel
var $img = $('.imgsc'); // on cible les images contenues dans le carrousel
var indexImg = $img.length - 1; // on définit l'index du dernier élément
i = 0;
var $currentImg = $img.eq(i);
$img.css('display', 'none');
$currentImg.css('display', 'block');

$('.navg').click(function(){ // image précédente
// on décrémente le compteur, puis on réalise la même chose que pour la fonction "suivante"

    if(i < indexImg) {

    i++;

}
else { i=0;
}

    $($img).fadeOut('fast');

    $currentImg = $img.eq(i);

    $($currentImg).stop();

        $($currentImg).fadeIn('fast');

    $currentImg.css('display', 'block');

});

});

</script>

[/code]

Le premier bloc js c'est pour le redimensionnement de l'image, cela marche, c'est plus la fin qu'il faudrait voir ce qu'il faut faire...
En effet, je voudrais faire une transition slide et non en fade (pour cela j'ai tout à revoir et je le sais bien, ca serait bien qu'on m'aiguille ;) !, j'ai lu le tuto de grafikart sur le slider....

Mais déjà comme cela pouvez vous me dire si il est compatible < ie9

Si je fais un avec un slide de côté est-ce qu'il va être toujours compatible ie8 par exemple ?

Est-ce que mon script n'est pas trop lourd ??

Bref si vous avez des suggestions ou encore des liens avec tuto ect... je suis preneur !

Super votre site j'ai bcp appris avec vous !

@+

Aucune réponse