This discussion is archived
7 Replies Latest reply: Feb 22, 2013 1:38 PM by Sudipto Desmukh RSS

Nivo slider(Image slideshow) implementation in adf

Wecenter Guru Newbie
Currently Being Moderated
Hi All,
I am using jdev version 11.1.1.6.0.

I followed below link to create the Image slide show.
http://designmodo.com/image-slider-jquery-css3/

I am able to make slide show of images successfully
but not able to give title(Caption) to that image.
As they said there should be same title attribute of image with id of div tag of the caption as like below
<div id="slider" class="nivoSlider">
 
    <img src="img/slide1.png" alt="" title="#caption1">
 
    <img src="img/slide2.png" alt="">
 
    <img src="img/slide3.png" alt="" title="#caption3">
 
    <img src="img/slide4.png" alt="">
 
</div>
 
<div id="caption1" class="nivo-html-caption">
    <strong>New Project</strong> <span></span> <em>Some description here</em>.
</div>
 
<div id="caption3" class="nivo-html-caption">
    <strong>Image 3</strong> <span></span> <em>Some description here</em>.
</div>
where caption1 and caption3 attributes are same.
but how to give title attribute to af:image by which property
In adf I have done it in following way.
because I am not able to set the caption.
I set it manually. but it does not get the slide show effects to the caption
<div class="slider-wrapper theme-alfa">
<div id="slider" class="nivoSlider">                   
                  <af:iterator
                      var="row"                              
                      id="tBan"
                      value="#{sessionScope.AfLocaleBean.finalBannerList}">                     
                                  <c:set var="proImage"
                                         value="'AlfaAesarUCMConnection#dDocName:#{row.docContentId}"/>
                      <af:goImageLink  destination="#{row.docLink}" id="gil1"
                                      text="#{row.docTitle}"
                                      icon="#{documentsService.latestReleasedVersionURL[proImage]}" styleClass="nivo-banner-caption" />
                                      <!-- inlineStyle="background-color: transparent;     color: white;     font-family: 'open_sansbold',Arial,sans-serif;     font-size: 40px;     left: 100px;     line-height: 50px;   top: 50px;     width: 50%;"/> -->
                  </af:iterator> 
     </div>
</div>
Here text="#{row.docTitle}" attribute of af:goImageLink is a title but it does not get the effects of slideshow

Edited by: Wecenter Guru on Feb 19, 2013 7:36 PM

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points