Utilisation JS plugin bootstrap dans prestashop 1.6

[superminou]

Si je veux utiliser la librairie de plugin JS bootstrap, tout est deja integre dans prestashop 1.6 ?

 

Exemple concret avec TOOLTIPS : http://getbootstrap.com/javascript/#tooltips

 

Si je copie-colle ca :

 

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>

 

Ca fonctionne ?

 

Ou dois-je rajouter 

 

$('#example').tooltip(options)

 

MERCI d'avance.

 

ps : 6 fois de suite que je retape mon post sans que ca fonctionne, ca me renvoi sur l'accueil !!! 

[superminou]

HS :

 

Pour l'equipe presta qui gere le forum :

 

Ok pour info si je met mon code en mode code source, ca plante, ne poste pas et me renvoie sur l'accueil.

6 tentatives echouees et la ca fonctionne si je ne mets rien en code source.

[superminou]

En fait je me rends compte que l'editeur sur la page description n'apprecie pas tant que ca le HTML.

 

Il prend certains passages et transforme le reste en texte.

 

Doit-on se resoudre a parametrer le tinyMCE editeur ou bien est-ce un bug.

 

Exemple precis :

 

ce code :

 

<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>

 

devient :

 

Tooltip on left

 

Bug presta ou c'est normal ???

[Daniel - PrestaBR]

If you didn't fixed it, You can use the default tooltip activation (one for each layout/effect you want).

Something like this:

 

Google translated:

Si vous ne l'avez pas fixe, vous pouvez utiliser l'activation de l'info-bulle par défaut (un pour chaque mise en page / effet que vous voulez). 

Quelque chose comme ceci:

$(document).ready(function() {
$(".tooltip").tooltip({
        placement : 'top',
animation: true,
});
$(".tooltip-top").tooltip({
        placement : 'top',
animation: true,
});
$(".tooltip-left").tooltip({
        placement : 'left',
animation: true,
});
$(".tooltip-bottom").tooltip({
        placement : 'bottom',
animation: true,
});
$(".tooltip-right").tooltip({
        placement : 'top',
animation: true,
});
$(function () { $("[data-toggle='tooltip']").tooltip(); });
});

And some CSS:

Et un peu de CSS:

/* tooltip CSS */
.tooltip{
    position:absolute;
    z-index:1020;
    display:block;
    visibility:visible;
    padding:5px;
    font-size:11px;
    opacity:0;
    filter:alpha(opacity=0)
}
.tooltip.in{
    opacity:.8;
    filter:alpha(opacity=80)
}
.tooltip.top{
    margin-top:-2px
}
.tooltip.right{
    margin-left:2px
}
.tooltip.bottom{
    margin-top:2px
}
.tooltip.left{
    ;
    left:50%;
    ;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:5px solid #000
}
.tooltip.left .tooltip-arrow{
    top:50%;
    right:0;
    margin-top:-5px;
    border-top:5px solid transparent;
    border-bottom:5px solid transparent;
    border-left:5px solid #000
}
.tooltip.bottom .tooltip-arrow{
    top:0;
    left:50%;
    ;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-bottom:5px solid #000
}
.tooltip.right .tooltip-arrow{
    top:50%;
    left:0;
    margin-top:-5px;
    border-top:5px solid transparent;
    border-bottom:5px solid transparent;
    border-right:5px solid #000
}
.tooltip-inner{
    max-width:200px;
    padding:3px 8px;
    color:#fff;
    text-align:center;
    text-decoration:none;
    background-color:#000;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px
}
.tooltip-arrow{
    position:absolute;
    width:0;
    height:0
}

Good luck.