Couroussel avec liens

Fermé
fep-pascal Messages postés 3 Date d'inscription jeudi 12 mai 2011 Statut Membre Dernière intervention 15 juin 2011 - 14 juin 2011 à 12:58
fep-pascal Messages postés 3 Date d'inscription jeudi 12 mai 2011 Statut Membre Dernière intervention 15 juin 2011 - 15 juin 2011 à 17:45
Bonjour,

J'ai un problème j'aimerais trouver un couroussel qui aurait des liens sur les images.

J'ai déjà essayer mais je n'arrive pas à le faire!

Voici un script d'un type de caroussel qui serait bien pour moi, pouvez vous m'aider svp merci.

script:

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>

<style type="text/css">

body{
font-family:Verdana, Geneva, sans-serif;
background-color:#9688ab;
}

.genelipse img{
position:absolute;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-khtml-border-radius:5px;
border-radius:5px;
border-style:solid;
border-width:2px;
border-color:gray;
cursor:pointer;
}

.genelipse{
position:relative;
margin:auto;
top:50px;
height:400px;
width:500px;
border-style:solid;
border-width:3px;
border-color:gray;
background-color:#151A6B;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
border-radius:10px;
}

.center{
z-index:1;
position:absolute;
height:40%;
top:15%;
}

</style>

<script type="text/javascript">

(function($){
$.fn.extend({
carousel: function(options) {
var self = this;
var oxo;
var defaults = {
onClickImg : function(event){ return false;},
setX:0
};

var options = $.extend(defaults, options);
var imgCenter;
var rot,cocoef,all,pi2,taillemage;

var ellipse = function(){
if(typeof rot == 'undefined'){
imgCenter.css("left",(self.width()/2)-(imgCenter.width()/2));
rot=0;
cocoef=0.3/1
all=self.find("img");
pi2=(Math.PI*2)/(all.length-1)
taillemage=self.height()/10
}

var oml=((self.offset().left+(self.width()/2))-options.setX)/2000;

oml=oml>0 ? -oml : Math.abs(oml);

if(oml>0.02 || oml<-0.02){
if(rot>=Math.PI*2 || rot<=-(Math.PI*2)){
rot=0;
}

rot+=oml;
var rayon=(self.width()/2)-(taillemage/2)-25;
var t=self.height()/2;

for(var i=1;i<all.length;i++){
var gogo=$(all[i]);
var decal=rot+pi2*i
gogo.css("left",(Math.cos(decal)*rayon)+rayon+15);
gogo.css("top",((Math.sin(decal)*rayon)*cocoef)+t);
gogo.css("width",taillemage*(Math.sin(decal))+taillemage);

var opasi=Math.sin(decal)+1;
gogo.fadeTo(5, opasi);

if(Math.cos(decal)*rayon>40 || Math.cos(decal)*rayon>(-40)){
self.css("zIndex",1);
}else{
self.css("zIndex",0);
}
}
}
if(arguments[0]=='start'){
oxo=setInterval(ellipse,50)
}
};

//Iterate over the current set of matched elements
return this.each(function() {
var obj = $(this);
obj.addClass("genelipse");

$(document).mousemove(function(e){
options.setX = e.clientX + $(document).scrollLeft();
});

obj.bind("mouseover",function(){
ellipse("start");
});

obj.bind("mouseout",function(){
clearInterval(oxo)
});

imgCenter = $("<img class='center' src='"+options.datas[0]+"'>").appendTo(obj);

for(var i=0;i<options.datas.length;i++){
$("<img src='"+options.datas[i]+"'>")
.bind("click",function(event){
var taille=$(this).width()/$(this).height();
imgCenter.attr("src",$(this).attr("src"));
imgCenter.css("left",(self.width()/2)-((taille*imgCenter.height())/2));
options.onClickImg(event);
})
.bind("mouseover",function(event){
var taille=$(this).width()/$(this).height();
imgCenter.attr("src",$(this).attr("src"));
imgCenter.css("left",(self.width()/2)-((taille*imgCenter.height())/2));
})
.appendTo(obj);
}

ellipse();
});
}
});
})(jQuery);


$(document).ready(function() {
$('#demo').carousel(
{datas: [ 'http://www.f-e-p.net/Img/Antenne/d06.jpg','http://www.f-e-p.net/Img/Antenne/d07.jpg','http://www.f-e-p.net/Img/Antenne/d08.jpg','http://www.f-e-p.net/Img/Antenne/d09.jpg','http://www.f-e-p.net/Img/Antenne/d10.jpg','http://www.f-e-p.net/Img/Antenne/d11.jpg',
'http://www.f-e-p.net/Img/Antenne/d12.jpg','http://www.f-e-p.net/Img/Antenne/d13.jpg','http://www.f-e-p.net/Img/Antenne/d20.jpg','http://www.f-e-p.net/Img/Antenne/d21.jpg','http://www.f-e-p.net/Img/Antenne/d22.jpg','http://www.f-e-p.net/Img/Antenne/d24.jpg',
'http://www.f-e-p.net/Img/Antenne/d25.jpg','http://www.f-e-p.net/Img/Antenne/d26.jpg']});
});

</script>


<div id="demo"></div>

1 réponse

fep-pascal Messages postés 3 Date d'inscription jeudi 12 mai 2011 Statut Membre Dernière intervention 15 juin 2011
15 juin 2011 à 17:45
Bonsoir,

Pas de réponse?
Je suis déçu je croyais pouvoir être aider,
merci quand même!!

Amicalement Pascal
0