Отображение слайдера изображения jquery с использованием xslt

У меня есть две xml-страницы, одна из которых (Slide.xml) содержит информацию об изображениях слайдера, я хочу отображать эти изображения в виде слайдера jquery с помощью xslt. Все, что мне удалось сделать, это показать слайдер, но изображения не будут отображаться. Пожалуйста, помогите мне.
Slide.xml:
Отображение слайдера изображения jquery с использованием xslt

<?xml version="1.0" encoding="UTF-8"?> 
<slide> 
    <image>nemo.jpg</image> 
    <image>up.jpg</image> 
    <image>walle.jpg</image> 
</slide>

index.xml:

<?xml version="1.0" encoding="UTF-8"?> 
<?xml-stylesheet type="text/xsl" href="Pub.xsl"?> 
<liste> 
    <page name="Pub.xml" ></page> 
    <page name="Slide.xml" ></page> 
</liste>

XSLT-файл:

<?xml version="1.0" encoding="UTF-8"?> 
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
    xmlns:xs="http://www.w3.org/2001/XMLSchema" exclude-result-prefixes="xs" version="2.0"> 
    <xsl:template match="/"> 
     <html xmlns="http://www.w3.org/1999/xhtml"> 
      <head> 
       <title>TEST</title> 
       <!-- slider --> 
       <link rel="stylesheet" href="Nivo-Slider/nivo-slider.css" type="text/css"/> 
       <link rel="stylesheet" href="Nivo-Slider/themes/default/default.css" 
        type="text/css"/> 
       <script src="Nivo-Slider/jquery-1.11.3.js" type="text/javascript"/> 
       <script src="Nivo-Slider/jquery.nivo.slider.pack.js" type="text/javascript"/> 
       <!--slider--> 
       <link rel="stylesheet" href="main.css" type="text/css"/> 
      </head> 

      <body> 
       <div class="content"> 
        <div id="header"> 
         <h1>Hello</h1> 
         <div id="nav"> 
          <ul> 
           <li> 
            <a href="#">Accueil</a> 
           </li> 
           <li> 
            <a href="#">Contact</a> 
           </li> 
           <li> 
            <a href="#">A propos</a> 
           </li> 
          </ul> 
         </div> 
         <div style="clear: both"> </div> 
         <div id="searchBox"> 
          <form action="#"> 
           <input type="text" class="box"/> 
           <input type="submit" class="button" value="Rechercher"/> 
          </form> 
         </div> 
        </div> 
        <div class="slider-wrapper theme-default"> 
         <div id="slider" class="nivoSlider"> 
          <xsl:for-each select="document('Slide.xml')/slide/image"> 
           <img src="{image}" alt="aa"/> 
          </xsl:for-each> 
         </div> 
        </div> 
        <div id="htmlcaption" class="nivo-html-caption"> 
         <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>. </div> 
        <script type="text/javascript"> 
        $(window).load(function() { 
        $('#slider').nivoSlider(); 
        }); 
       </script> 
       </div> 
      </body> 
     </html> 
    </xsl:template> 
</xsl:stylesheet>

источник

2015-11-05 Mina

Внутри for-each вам просто нужно использовать <img src="{.}" alt="aa"/> для вывода строки значение контекстный узел. Ваша попытка <img src="{image}" alt="aa"/> будет искать дочерний элемент image контекстного узла.

источник

2015-11-05 11:52:43

Это сработало, спасибо! – Mina

Отображение слайдера изображения jquery с использованием xslt

ответ

Смежные вопросы