`
747017186
  • 浏览: 329880 次
社区版块
存档分类
最新评论

JS图片切换脚本

    博客分类:
  • js
 
阅读更多

<script language =javascript > 

var curIndex=0;  

var arr=new Array(); //把图片的URL都放在数组中

arr[0]="1.jpg"; 

arr[1]="2.jpg"; 

arr[2]="3.jpg"; 

arr[3]="4.jpg"; 

arr[4]="5.jpg"; 

function next() { 

var obj=document.getElementById("showpic"); 

curIndex+=1; 

if(curIndex>arr.length-1){

alert("the last");

curIndex=arr.length-1;

}else{

obj.src="image/"+arr[curIndex]; 

}

 

function pre(){

var obj=document.getElementById("showpic"); 

curIndex-=1; 

if(curIndex<0){

alert("the first");

curIndex=0;

}else{

obj.src="image/"+arr[curIndex]; 

}

}

</script> 

<img src="image/1.jpg" width="1000" height="800" id="showpic" /> 

<button onclick="pre();">pre</button>

<button onclick="next();">next</button>

分享到:
评论

相关推荐

    图片切换脚本

    这里我们讨论的“图片切换脚本”是一种基于JavaScript(简称js)的编程技术,用于实现网页上的动态图片轮播效果。JavaScript是前端开发中的重要语言,它可以为网页添加动态功能,而无需刷新页面。 图片切换脚本通常...

    FLASH图片切换、javascript图片切换

    "FLASH图片切换"和"javascript图片切换"是两种常用的技术手段,各有其特点和适用场景。 首先,我们来谈谈“FLASH图片切换”。Flash是一种由Adobe公司开发的多媒体创作平台,它曾广泛用于创建动画、交互式内容和网页...

    JS多种新闻图片切换效果

    在这个项目中,“JS多种新闻图片切换效果”指的是使用JavaScript实现的不同类型的新闻图片轮播功能。这类效果通常用于新闻网站或者资讯平台,以动态展示多张图片,提高用户的浏览体验。 1. 图片切换效果类型: - ...

    图片自动切换的JS脚本

    在提供的压缩包文件"变换图片_js脚本"中,很可能包含了实现上述功能的详细代码,你可以通过查看和学习这些代码来进一步理解如何使用JavaScript来实现图片切换效果。同时,也可以参考其他开源的JavaScript库,如Slick...

    JavaScript图片切换滑动效果

    JavaScript图片切换滑动效果是一种常见的网页动态展示技术,它通过编程方式实现图片的平滑过渡,为用户带来更丰富的视觉体验。在网页设计中,这种效果通常用于相册、产品展示或者广告轮播等场景。以下将详细讲解实现...

    js特效(大全),图片切换JS 图片放大JS

    1. 图片切换的JavaScript脚本,如`imageSlider.js`,它可能实现了上述提到的图片轮播功能。 2. 图片放大的JavaScript实现,例如`imageZoom.js`,可能使用了HTML5的特性来实现图片放大效果。 3. 相关的HTML和CSS文件...

    JavaScript图片切换展示效果.rar

    JavaScript图片切换展示效果是一种常见的网页动态元素,常用于创建引人入胜的用户体验,例如网站的焦点图或幻灯片展示。这种效果可以自动或手动切换页面上的图片,为用户提供一个交互式的浏览环境。在本项目中,...

    90个js图片切换代码

    JavaScript(简称JS)是一种轻量级的脚本语言,常用于网页和网络应用中的动态内容控制,包括图片的切换效果。在"90个js图片切换代码"这个资源包中,很可能包含了多种不同的图片轮播或幻灯片展示的实现方式,这些都是...

    js图片切换,点击切换

    "js图片切换,点击切换"这一主题涉及到JavaScript(简称JS)技术在实现动态图片展示中的应用。JavaScript是一种广泛使用的客户端脚本语言,它允许我们通过用户的交互(如点击事件)来改变页面内容,提供更丰富的用户...

    js图片轮播脚本

    5. 动画效果:在图片切换时加入过渡动画,使切换更平滑。 实现这个功能,我们可以使用JavaScript的事件监听、定时器(setTimeout或setInterval)以及CSS3的动画效果。 以下是实现js图片轮播脚本的关键步骤: 1. *...

    js特效脚本含源码和说明JavaScript图片切换展示效果

    js特效脚本含源码和说明JavaScript图片切换展示效果本资源系百度网盘分享地址

    js图片 切换 轮换效果 swf版

    "js图片切换轮换效果swf版"是一个专为网页设计打造的JavaScript组件,它能够实现多张图片在页面上自动循环播放的效果,为浏览者带来视觉上的动态体验。这种效果在网站的首页、产品展示或滑块部分尤为常见。 ...

    javascript图片切换代码

    在这个场景中,我们关注的是如何利用JavaScript来实现在客户端的图片切换效果,这通常用于创建动态的、吸引用户的网页图像展示。下面我们将深入探讨这个主题。 一、HTML基础 首先,我们需要在HTML中设置图片的容器...

    JS图片切换效果代码,相当好用

    在网页设计中,JavaScript(简称JS)是一种必不可少的脚本语言,用于增加页面的交互性和动态功能。在本文中,我们将深入探讨一个重要的知识点:如何使用JS实现图片切换效果。这种效果常见于网站的轮播图、幻灯片展示...

    javascript图片切换,可设置切换方式

    JavaScript图片切换是一种常见的网页动态效果,它允许用户在多个图像之间进行平滑过渡,从而提升用户体验,尤其是在展示产品图片或创建幻灯片展示时。在这个主题中,我们将深入探讨JavaScript如何实现图片切换,并...

    JS新闻图片切换

    JavaScript(简称JS)是一种轻量级的脚本语言,广泛应用于网页和网络应用开发,尤其在前端领域,它是实现动态效果、交互性以及数据处理的关键工具。在这个“JS新闻图片切换”的主题中,我们将深入探讨如何利用JS实现...

    带前后翻页的JS图片切换效果

    "带前后翻页的JS图片切换效果"是利用JavaScript编程语言实现的一种交互式图片展示技术,它允许用户通过点击前后翻页按钮来浏览一组图片。这种效果不仅增加了网站的视觉吸引力,还使用户能够更方便地导航和浏览内容。...

    多图片切换效果JavaScript实现

    本文将详细探讨如何使用JavaScript实现多图片切换效果,适用于新闻图片展示或网站焦点区域。 首先,JavaScript是一种强大的客户端脚本语言,常用于网页动态交互。在实现图片切换效果时,我们通常会利用JavaScript的...

    javascript 图片切换,自动切换。

    总结,JavaScript图片切换功能的关键在于利用DOM操作改变图片的显示状态,通过事件监听响应用户操作,结合定时器实现自动切换。这个功能对于网站来说非常实用,可以提高用户的浏览体验。在实际项目中,还可以结合CSS...

Global site tag (gtag.js) - Google Analytics