JavaScript实现简单图片翻转的方法
更新时间：2015年04月17日 09:44:03 作者：dingding
这篇文章主要介绍了JavaScript实现简单图片翻转的方法,涉及javascript操作图片与数组的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了JavaScript实现简单图片翻转的方法。分享给大家供大家参考。具体如下：
这里先取两个命名smirk1.jpg和smirk2.jpg同样大小的图像
然后运行下面的代码，可以实现简单的图片翻转
<script type="text/javascript">
var revert = new Array();
var inames = new Array('smirk');
// Preload
if (document.images) {
var flipped = new Array();
for(i=0; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = ""+inames[i]+"2.JPG";
}
}
function over(num) {
if(document.images) {
revert[num] = document.images[inames[num]].src;
document.images[inames[num]].src = flipped[num].src;
}
}
function out(num) {
if(docu <script type="text/javascript">
var revert = new Array();
var inames = new Array('smirk');
// Preload
if (document.images) {
var flipped = new Array();
for(i=0; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = ""+inames[i]+"2.JPG";
}
}
function over(num) {
if(document.images) {
revert[num] = document.images[inames[num]].src;
document.images[inames[num]].src = flipped[num].src;
}
}
function out(num) {
if(document.images) document.images[inames[num]].src = revert[num];
}
</script>
希望本文所述对大家的javascript程序设计有所帮助。
相关文章
这篇文章主要介绍了JavaScript实现俄罗斯方块游戏过程分析及源码分享,本文分解了游戏规则、实现过程、难点分析及实现源码,需要的朋友可以参考下2015-03-03
今天小编就为大家分享一篇layer弹窗在键盘按回车将反复刷新的实现方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
这篇文章主要介绍了JS实现侧悬浮浮动实例代码，有需要的朋友可以参考一下2013-11-11
本文是一篇关于Javascript的中级进阶总结。小编希望大家能够在30分钟之内阅读完并认真体会，多敲代码，多总结，毕竟Javascript本身并不难。2016-07-07
这篇文章主要介绍了bootstrap是什么，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-07-07
这篇文章主要为大家详细介绍了如何利用JavaScript语言实现判断两个日期不能跨年和跨月，文中的示例代码讲解详细，感兴趣的小伙伴可以了解一下2023-04-04
这篇文章主要介绍了小程序使用watch监听数据变化的方法详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-09-09
js 加载并解析XML字符串的实现代码，需要的朋友可以参考下。2009-12-12
下面小编就为大家带来一篇浅谈JavaScript的计时器对象。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧，祝大家游戏愉快哦2016-12-12
在本文中，我们将学习 JavaScript 中提供，的 for 循环，我们将了解如何在 JavaScript 中使用 for...in 循环语句、其语法、工作原理示例、何时使用或避免使用它以及我们可以使用哪些其他类型的循环,需要的朋友可以参考下2023-07-07
最新评论