Link to home
Start Free TrialLog in
Avatar of altariamx2003
altariamx2003Flag for Mexico

asked on

how to hyperlink slides using revolution slider

I would like to know how to hyperlink slides  using revolutions slider

I use this code to presents my slides:
				<div class="slider-container">
					<div class="slider" id="revolutionSlider" data-plugin-revolution-slider data-plugin-options='{"startwidth": 1699, "startheight": 600}'>
						<ul>
      <!-- SLIDE  -->
        <li data-transition="fade" data-slotamount="10" data-masterspeed="300"><img class="img-responsive" src="/imagenes/img1.jpg" data-bgposition="left center" data-bgfit="100% auto" data-bgrepeat="no-repeat" />
        </li>
						</ul>
					</div>
				</div>

Open in new window


and this is the result:
User generated image-------------------------------
Im trying to add a link to the slides, this is the code that Im using with hyperlinks
				<div class="slider-container">
					<div class="slider" id="revolutionSlider" data-plugin-revolution-slider data-plugin-options='{"startwidth": 1699, "startheight": 600}'>
						<ul>
      <!-- SLIDE  -->
        <li data-transition="fade" data-slotamount="10" data-masterspeed="300"><a href="becas/programas/otra-beca-mas">
		        <img class="img-responsive" src="/imagenes/img1.jpg" data-bgposition="left center" data-bgfit="100% auto" data-bgrepeat="no-repeat" /></a>
        </li>
						</ul>
					</div>
				</div>

Open in new window

and this is the result:
User generated image---------------------------------------
My question is what I doing wrong when I add the hyperlink to the image inside the hyperlink??

What can i do to add a link to the slides with slider revolution
ASKER CERTIFIED SOLUTION
Avatar of lenamtl
lenamtl
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of altariamx2003

ASKER

Im using jquery version
Thanks for take time to answer me

the support center link give me the solution

http://www.orbis-ingenieria.com/code/documentation/documentation.html#!/layout

the solution is to add data-link inside the li to add a hyperlink to all slide, and also if you need to add the target you can use data-target.

example (using just data-link):
				<div class="slider-container">
					<div class="slider" id="revolutionSlider" data-plugin-revolution-slider data-plugin-options='{"startwidth": 1699, "startheight": 600}'>
						<ul>
      <!-- SLIDE  -->
        <li data-transition="fade" data-slotamount="10" data-masterspeed="300" data-link="becas/programas/otra-beca-mas"><img class="img-responsive" src="/imagenes/img1.jpg" data-bgposition="left center" data-bgfit="100% auto" data-bgrepeat="no-repeat" />
        </li>
						</ul>
					</div>
				</div>

Open in new window




example (using data-link and data-target):
				<div class="slider-container">
					<div class="slider" id="revolutionSlider" data-plugin-revolution-slider data-plugin-options='{"startwidth": 1699, "startheight": 600}'>
						<ul>
      <!-- SLIDE  -->
        <li data-transition="fade" data-slotamount="10" data-masterspeed="300" data-link="becas/programas/otra-beca-mas"  data-target="_blank"><img class="img-responsive" src="/imagenes/img1.jpg" data-bgposition="left center" data-bgfit="100% auto" data-bgrepeat="no-repeat" />
        </li>
						</ul>
					</div>
				</div>

Open in new window