Slidshow + zoombox [Résolu]

juni05 3 Messages postés jeudi 21 juin 2012Date d'inscription 21 juin 2012 Dernière intervention - 21 juin 2012 à 11:30 - Dernière réponse : juni05 3 Messages postés jeudi 21 juin 2012Date d'inscription 21 juin 2012 Dernière intervention
- 21 juin 2012 à 12:39
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'
});

});
Afficher la suite 

2 réponses

Répondre au sujet
juni05 3 Messages postés jeudi 21 juin 2012Date d'inscription 21 juin 2012 Dernière intervention - 21 juin 2012 à 12:39
+3
Utile
c'est bon j'ai trouvé, je ne maitrise pas, mais à force de bidouiller....
Cette réponse vous a-t-elle aidé ?  
Commenter la réponse de juni05
juni05 3 Messages postés jeudi 21 juin 2012Date d'inscription 21 juin 2012 Dernière intervention - 21 juin 2012 à 11:50
0
Utile
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.
Commenter la réponse de juni05

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.