Faire fonctionner le plugin jQuery tubular
Résolu
Skyronn
Messages postés
41
Statut
Membre
-
animostab Messages postés 3003 Date d'inscription Statut Membre Dernière intervention -
animostab Messages postés 3003 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je suis en train de créer mon site web et j'ai trouvé ce système de design vraiment sympa:
http://www.seanmccambridge.com/tubular/
Le problème c'est que j'ai aucune idée de comment le faire fonctionner :(
( Quel code, comment faire fonctionner Java, quel ordre, etc, )
Est-ce que quelqu'un pourrait m'expliquer facilement comment je peux mettre en place ce plugin?
Merci !
Je suis en train de créer mon site web et j'ai trouvé ce système de design vraiment sympa:
http://www.seanmccambridge.com/tubular/
Le problème c'est que j'ai aucune idée de comment le faire fonctionner :(
( Quel code, comment faire fonctionner Java, quel ordre, etc, )
Est-ce que quelqu'un pourrait m'expliquer facilement comment je peux mettre en place ce plugin?
Merci !
2 réponses
-
salut
très facile
tu télécharge https://jquery-tubular.googlecode.com/files/jquery.tubular.1.0.1.zip tu mets le dossier js à la racine de ton site
ensuite dans le head tu colle ce bout de code<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8" src="js/jquery.tubular.1.0.js"></script>
<script type="text/javascript" charset="utf-8" src="js/index.js"></script>
dans index.js tu peux changer l'id de la video (id youtube)
dans jquery.tubular.1.0.js tu peux modifier les options
après <body> tu mets <div id="wrapper" class="clearfix">
avant </body> tu mets </div>
dans ton css tu mets
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
#wrapper { width: 960px; margin: 0 auto; padding: 48px 0 72px; } /*a modifier selon ton site*/
-
Ah ! Super ! Ça marche nickel !
Je te remercie pour ta réponse claire et précise !
J'ai deux autres petites questions, j'ai pris un screen: http://puu.sh/fyqNR/9c4bfb8b26.jpg
Tu sais comment enlever la ligne du code tout en haut ?
Et puis saurais-tu pourquoi j'ai pas les cadres noirs autour du texte comme dans l'exemple ?
Merci encore ;P
-
-
Bonjour,
Pour le ligne de code :
$('#wrapper').tubular({videoId: 'QnaMOPYKXR4'});
il faut supprimer la ligne 20 de la page index.html
< code>$('#wrapper').tubular({videoId: 'QnaMOPYKXR4'});</ code>
et pour le fond des texte qui forme un cadre noir transparent, il faut creer un dossier media et y upload l'image black-50-trans.png que tu trouvera la:
http://www.seanmccambridge.com/tubular/media/black-50-trans.png
