`
yasuoji120
  • 浏览: 6013 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

超级简单的JS图片切换

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="javascript">
var pic=0;
var isAutoplay=true;
var picname=new Array();
picname[0]="http://www.yasuoji120.com/uploads/110411/1-110411224941923.jpg";
picname[1]="http://www.yasuoji120.com/uploads/allimg/110418/1-11041Q35Q50-L.jpg";
picname[2]="http://www.yasuoji120.com/uploads/110429/1-110429112419417.jpg";


function down()
{
if(pic<=0)
{
  pic=picname.length-1;
}
else
{
  pic=pic-1;
}
var photo=document.getElementById('photo');
photo.src=picname[pic];
}
function auto()
{
down();
if(isAutoplay==true)
{
  setTimeout("auto()",1500);
}
}

</script>
<title>无标题文档</title>
</head>

<body onload="auto();">
<img src="http://www.yasuoji120.com/uploads/110429/1-110429112419417.jpg" id="photo"  />
</body>
</html>


分享到:
评论

相关推荐

    html+css+js实现图片切换效果

    标题中的“html+css+js实现图片切换效果”是指利用HTML、CSS和JavaScript这三种核心技术来创建一个动态的图片轮播或切换功能。在网页设计中,这种效果常见于产品展示、滑动相册或者幻灯片展示等场景,能够为用户带来...

    超好看的图片切换效果

    2. **JavaScript/jQuery库**:如jQuery,它简化了DOM操作和动画处理,可以轻松创建复杂的图片切换效果,例如轮播图、幻灯片等。 3. **Bootstrap或类似的框架**:这些前端框架内置了图片切换组件,如Bootstrap的...

    超级炫酷的图片切换,还响应左右键的切换

    在IT领域,特别是前端开发中,创建一个"超级炫酷的图片切换,还响应左右键的切换"的交互效果是一项常见的任务,它涉及到用户界面设计、JavaScript编程以及可能的CSS3动画技术。以下是对这个项目的一些详细解释: ...

    JS图片切换广告网页特效

    学习和理解JS图片切换广告网页特效,不仅可以帮助开发者创建出吸引人的网页,还能深入掌握JavaScript的基本语法和面向对象编程思想,对于提升前端开发技能具有重要意义。在实践中,可以尝试调整代码参数,如切换速度...

    超酷的仿QQ图片切换JS效果

    "超酷的仿QQ图片切换JS效果"是一个专门针对这一需求设计的JavaScript解决方案,它模仿了QQ应用程序中图片浏览的方式,为用户提供流畅且具有视觉吸引力的图片切换体验。 JavaScript(JS)是一种广泛使用的客户端脚本...

    10种漂亮的图片切换特效JS

    本文将深入探讨标题"10种漂亮的图片切换特效JS"所涵盖的知识点,并结合描述中的“非常炫目的图片切换特效”来讲解这些特效如何为网站增添魅力。 首先,我们要理解JS图片切换特效的基本原理。它通常是通过改变HTML...

    html5图片切换jquery css3 Transitions属性制作超酷的3D图片切换代码.zip

    3. `js`: 可能包含jQuery脚本文件,实现图片切换逻辑。 4. `css`: 包含CSS样式表,定义了元素的样式和3D转换效果。 综上所述,这个项目展示了HTML5、jQuery和CSS3的强大组合,特别是CSS3的Transitions和Transforms...

    利用js实现动态图片切换

    以上就是使用JavaScript实现动态图片切换的基本步骤。通过这个过程,你可以创建一个简单的图片轮播组件,适用于各种网页设计项目。在实际应用中,可以根据具体需求进行调整,例如添加导航指示器、控制速度、支持键盘...

    3D超牛动态图片切换

    总之,3D超牛动态图片切换是一种将3D特效融入图片浏览体验的技术,它通过CSS3、JavaScript和WebGL的结合,创造出引人入胜的视觉效果,提升网页的吸引力。理解和掌握这些技术对于提升网页设计和开发能力至关重要。在...

    图片切换简单模式

    "图片切换简单模式"指的是实现一种用户友好的、直观的图片浏览功能,让用户能够轻松地在多张图片之间进行切换,通常通过左右滑动或点击按钮等操作。这种模式尤其适用于展示产品细节、图像画廊或者在有限的空间内展示...

    slicease.js HTML5 canvas 3D动画 超漂亮的大图片切换 超动感的 网站头部图片切换

    本文将深入探讨一款名为slicease.js的开源项目,它专为网站头部设计了一种超漂亮的3D大图片切换效果,为网页增添动感与活力。 首先,slicease.js的核心技术在于HTML5的Canvas元素。Canvas作为HTML5的一个重要特性,...

    超漂亮Js+css图片幻灯切换.rar

    超漂亮Js+css图片幻灯切换.rar超漂亮Js+css图片幻灯切换.rar超漂亮Js+css图片幻灯切换.rar超漂亮Js+css图片幻灯切换.rar超漂亮Js+css图片幻灯切换.rar超漂亮Js+css图片幻灯切换.rar

    超级好的图片切换,用过一定觉得好

    根据提供的信息,我们可以总结出以下有关“超级好的图片切换”这一功能的相关知识点: ### 1. 图片切换技术概述 图片切换技术广泛应用于网站设计之中,可以为用户提供更丰富的视觉体验,同时也是一种提升用户交互...

    8种js图片切换效果

    在本主题中,我们将探讨8种不同的JS图片切换效果,这些效果能够为网站增添视觉吸引力,提升用户体验。这些效果通常结合HTML(超文本标记语言)和CSS(层叠样式表)来实现,下面我们将详细讨论每种效果及其实现方法。...

    超酷图片切换

    3. **框架与库**:许多开发者会使用像jQuery、React或Vue.js这样的库或框架来简化图片切换的实现。这些工具提供了封装好的API,可以快速实现图片轮播、滑块等功能。 4. **性能优化**:考虑到用户体验,图片切换应...

    简单的图片查看js

    4. **动画效果**:为了让图片切换更平滑,开发者可能会添加过渡效果,比如淡入淡出、滑动等。这可以通过CSS3的动画或者JavaScript的定时器配合修改样式来实现。 5. **错误处理**:对于可能出现的图片加载失败,...

    JS鼠标碰到索引按钮图片切换代码.zip

    在给定的“JS鼠标碰到索引按钮图片切换代码.zip”中,我们关注的是一个用于图片轮播的JS特效,特别是一种基于用户鼠标悬停索引按钮来切换图片的功能。这种技术在网站设计中非常常见,用于吸引用户的注意力并展示多张...

    Js幻灯图片切换代码.rar

    一款简洁风格的Js幻灯图片切换代码,常言说:好吃不过饺子、舒服不过躺着。现在已经有很多焦点图片的代码了,有JS的、也有flash的。不过看了很多,却发现对于项目开发来说,很多的焦点图片却不是那么容易使用的:有...

Global site tag (gtag.js) - Google Analytics