[英]javascript image slider hyperlinks
I am working on a website and my client wants an image slider where each slide links to a different page on the site. 我在一个网站上工作,我的客户想要一个图像滑块,其中每个幻灯片都链接到站点上的不同页面。 I would prefer if this were to stay in Javascript as I cant seem to wrap my head around jquery. 我希望这是否保留在Javascript中,因为我似乎无法绕过jquery。 Here is my code 这是我的代码
Javascript code in the header 标头中的Javascript代码
`<script type="text/javascript">
<!--
var img1 = new Image()
img1.src="DowntownEventNew.jpg"
var img2 = new Image()
img2.src="Shakespeare.jpg"
var img3 = new Image()
img3.src="DowntownConcertNew.jpg"
var img4 = new Image()
img4.src="Rangerettes.jpg"
//-->
</script>
HTML 5 and Javascript in the body 正文中的HTML 5和Javascript
<div class="content">
<div id="slide">
<div class="slide_container">
<a href="Restaurants.html"><img src="DowntownEventNew.jpg" name="slide" /> </a>
<script type="text/javascript">
<!--
var pic =1
function slides() {
if (!document.images)
return
document.images.slide.src=eval("img" +pic+".src")
if (pic < 4)
pic++
else
pic =1
setTimeout("slides()",5000)
}
slides()
//-->
</script>
</div>
</div>
Use a plugin like Nivo Slider (that way you don't really need to develop the jQuery from scratch), and then wrap the image in an anchor tag <a>
: 使用类似Nivo Slider的插件(这样,您实际上就不需要从头开始开发jQuery),然后将图像包装在锚标签<a>
:
<div id="slider">
<img src="images/thing.jpg" alt="No Link" />
<a href="http://www.cnn.com"><img src="images/thing2.jpg" title="Link!" /></a>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.