Charger une librairie javascript (flexslider) dans une page XSL

Version imprimable

Bonjour à tous,

Je rencontre des difficultés pour importer les fichiers javascript de Flexslider dans une page XSL, mon objectif étant de pouvoir afficher des images en récupérant l'url retourné par le fichier XML.

Sur le site de Flaxslider, ils présentent les 3 étapes pour faire ceci mais au format html :

Step 1 :
Code:

1 2 3 4  <link rel="stylesheet" href="flexslider.css" type="text/css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <script src="jquery.flexslider.js"></script>
Step 2 :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14  <div class="flexslider"> <ul class="slides"> <li> <img src="slide1.jpg" /> </li> <li> <img src="slide2.jpg" /> </li> <li> <img src="slide3.jpg" /> </li> </ul> </div>
Step 3 :
Code:

1 2 3 4 5 6  <script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.flexslider').flexslider(); }); </script>
Mais moi je souhaiterais retranscrire tout çà avec les balises XSL sinon celà ne fonctionne pas

Merci d'avance pour vos réponses

03/03/2015, 13h51
thelvin

Bah de toute façon XSLT te sert seulement à transformer un document XML en document HTML.

Donc il suffit de faire exactement comme en HTML, en fait. Tu peux nous montrer ce que tu as déjà fait avec du XSLT ?

Oui voici le code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:cml="http://tempuri.org/CryptML.xsd" exclude-result-prefixes="cml">
	<xsl:output method="html" encoding="utf-8"/>
  <xsl:template name="vignette">
    <xsl:if test="not(cml:FICHIER)">
      <img src="http://www.pagesimmo.com/images/pasphoto.gif" height="84px" width="113px"/>
    </xsl:if>
    <xsl:if test="cml:FICHIER">
      <xsl:for-each select="cml:FICHIER">
        <xsl:if test="cml:INDICE='1'">
          <img src="{cml:FICHIER_JOINT/cml:NOM_FICHIER}" border="1" height="84px" width="113px"/>
        </xsl:if>
      </xsl:for-each>
    </xsl:if>
  </xsl:template>
	<xsl:template match="ROOT">
  </xsl:template>
 
    <xsl:template match="cml:CRYPTML">
	</xsl:template>
 
	<xsl:template match="cml:TRANSFERT">
	</xsl:template>
 
	<xsl:template match="cml:EMETTEUR">
	</xsl:template>
 
 
 
	<xsl:template match="cml:DESTINATAIRE">
    <html>
      <head> 
      <xsl:element name="link">
      	<xsl:attribute name="rel">stylesheet</xsl:attribute>
      	<xsl:attribute name="type">text/css</xsl:attribute>
      	<xsl:attribute name="href"><xsl:value-of select="substring-before(substring-after(cml:DONNEE[cml:LIBELLE='Url_Request']/cml:VALEUR,'C_Rest=Css|!|'),'&amp;')"/></xsl:attribute>
      </xsl:element>
      </head>
<body>.....</body>....

et je souhaiterais mettre ce slider en place : http://flexslider.woothemes.com/thumbnail-slider.html

03/03/2015, 14h40
thelvin
Ben dans <head> tu mets les step 1 et step 3. Ça c'est tout comme ils disent en HTML.

et quelque part dans <body> tu mets le step 2 avec toutes les images dedans. Là je suppose que tu devras faire un truc genre
Code:

1 2 3 4 5 <div class="flexslider"> <ul class="slides"> <xsl:apply-templates/> </ul> </div>
avec un template genre :
Code:

1 2 3 4 5 <xsl:template match="un_element_image"> <li> <img src="{@url_de_l_image}"/> </li> </xsl:template>