code html pour cacher un text

jetwakka
Nouveau membre
6 0 0

 j aimerais cacher une partie de la description d un produit et laisser la possibiliter au client de la lire en un clique et de refermer au second clique .

un peu comme un alerte spoiler 

 

auriez vous la solution ,un code html magique ou il suffirais de copier coller et d y inscrire son text 

 

2 RÉPONSES 2
Fuznet
Shopify Expert
352 43 69

Bonsoir,

 

Utilisez ceci :

 

<p id="text"> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://tester3.yolasite.com/resources/javascript/jtruncate.js"></script>

<script type="text/javascript"> 
$(document).ready(function() { 
$('#text').jTruncate({ 
length: 100, 
minTrail: 2, 
moreText: "Lire plus", 
lessText: "Lire moins", 
ellipsisText: "...", 
}); 
});

</script>

 

Pour modifier la taille du texte affiché, faites varier la valeur :

 

length: 100

 

Le tout donnera ceci : http://jsfiddle.net/rxnoegqL/

 

Cordialement,

Fuznet - Agence Shopify Experts.

Routedusud
Nouveau membre
1 0 0

Bonjour,

Je souhaiterais adapter ce code pour l'utiliser à la description de mes collections. Le problème que je rencontre et que comme je mets des paragraphes et que je passe à la ligne le texte caché s'arrête à ma première phrase avant que je passe à la ligne... Comment faire pour que tout mon texte soit caché malgré ma mise en page? 

Merci !