Slidshow + zoombox [Résolu]

Signaler
Messages postés
3
Date d'inscription
jeudi 21 juin 2012
Statut
Membre
Dernière intervention
21 juin 2012
-
Messages postés
3
Date d'inscription
jeudi 21 juin 2012
Statut
Membre
Dernière intervention
21 juin 2012
-
Bonjour,

je suis débutant dans la création de site.

J'ai mis ce slideshow sur mon site http://thiagosf.net/projects/jquery/skitter/ que j'ai un peu modifié.
J'aimerai rajouter zoombox (lightbox) sur la même page. Mais je ne sais pas comment faire. Est ce possible?

Je n'y arrive pas. Que dois je mettre dans le html?

Merci de votre aide

juni

voici le premier!

<!-- CSS -->
<link type="text/css" href="css/skitter.styles.css" media="all" rel="stylesheet" />
<!-- JS -->
<script type="text/javascript" src="js/jquery-1.6.3.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.animate-colors-min.js"></script>
<script type="text/javascript" src="js/jquery.skitter.min.js"></script>
<!-- Init Plugin -->
<script>
$(document).ready(function() {
$(".box_skitter_large").skitter({
numbers: false,
numbers_align: "right",
dots: false,
preview: false,
focus: false,
focus_position: "rightTop",
thumbs: false,
controls: true,
controls_position: "rightTop",
progressbar: false,
progressbar_css: {
top:'5px',
left:'590px',
height:10,
borderRadius:'2px',
width:200,
backgroundColor:'#000',
opacity:.7
},
animateNumberOver: { 'backgroundColor':'#555' },
enable_navigation_keys: false
});
});


et le second

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="js/zoombox/zoombox.js"></script>
<link href="js/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript">
jQuery(function($){
$('a.zoombox').zoombox({
autoplay : true,
theme : 'prettyphoto'
});
});
</script>



voici le code que j'ai mis. Cependant, zoombox ne fonctionne pas. Exemple sur un lien youtube. La lightbox ne fonctionne pas. J'atterrie directement sur youtube.

Pouvez vous m'aider?
merci


<!-- CSS -->

<link type="text/css" href="css/skitter.styles.css" media="all" rel="stylesheet" />
<link href="js/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />

<!-- JS -->
<script type="text/javascript" src="js/jquery-1.6.3.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.animate-colors-min.js"></script>
<script type="text/javascript" src="js/jquery.skitter.min.js"></script>
<script type="text/javascript" src="js/zoombox/zoombox.js"></script>
<!-- Init Plugin -->

<script>




$(document).ready(function() {
$(".box_skitter_large").skitter({

numbers: false,
numbers_align: "right",
dots: false,
preview: false,

focus: false,
focus_position: "rightTop",
thumbs: false,
controls: true,
controls_position: "rightTop",


progressbar: false,
progressbar_css: {
top:'5px',
left:'590px',
height:10,
borderRadius:'2px',
width:200,
backgroundColor:'#000',
opacity:.7
},

animateNumberOver: { 'backgroundColor':'#555' },
enable_navigation_keys: false
});
});


jQuery(function($){
$('a.zoombox').zoombox({
autoplay : true,
theme : 'prettyphoto'
});

});

2 réponses

Messages postés
3
Date d'inscription
jeudi 21 juin 2012
Statut
Membre
Dernière intervention
21 juin 2012

c'est bon j'ai trouvé, je ne maitrise pas, mais à force de bidouiller....
Messages postés
3
Date d'inscription
jeudi 21 juin 2012
Statut
Membre
Dernière intervention
21 juin 2012

ca marche comme ca:


<link href='http://fonts.googleapis.com/css?family=Gloria+Hallelujah' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Rosario' rel='stylesheet' type='text/css'>


<!-- CSS -->
<link type="text/css" href="css/skitter.styles.css" media="all" rel="stylesheet" />
<link href="js/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />
<!-- JS -->
<script type="text/javascript" src="js/jquery-1.6.3.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.animate-colors-min.js"></script>
<script type="text/javascript" src="js/jquery.skitter.min.js"></script>
<script type="text/javascript" src="js/zoombox/zoombox.js"></script>
<!-- Init Plugin -->

<script>
$(document).ready(function() {
$(".box_skitter_large").skitter({

numbers: false,
numbers_align: "right",
dots: false,
preview: false,

focus: false,
focus_position: "rightTop",
thumbs: false,
controls: true,
controls_position: "rightTop",


progressbar: false,
progressbar_css: {
top:'5px',
left:'590px',
height:10,
borderRadius:'2px',
width:200,
backgroundColor:'#000',
opacity:.7
},

animateNumberOver: { 'backgroundColor':'#555' },
enable_navigation_keys: false
});
});

</script>

</head>


<script>
jQuery(function($){
$('a.zoombox').zoombox({
autoplay : true,
theme : 'prettyphoto'
});
});
</script>



Mais j'ai un autre probleme! j'ai une bande transparent du sildshow passe sur la lightbox.