js实现双击图片放大单击缩小的方法

 更新时间:2015年02月17日 11:56:45   作者:代码家园  
这篇文章主要介绍了js实现双击图片放大单击缩小的方法,涉及js操作图片及onclick与ondblclick事件的使用技巧,需要的朋友可以参考下

本文实例讲述了js实现双击图片放大单击缩小的方法。分享给大家供大家参考。具体实现方法如下:

复制代码 代码如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>双击图片放大,单击缩小</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function enlargeImage1(){
   image1.height="300"
}
function dropImage1(){
   image1.height="150"
}
//  End -->
</script>
<table>
<tr><td align="center">
<img src="/images/3.jpg" height="150" name="image1" ondblclick="enlargeImage1()" onclick="dropImage1()" style="cursor:pointer;"/>
</td></tr>
</table>
双击图片试试预览效果。
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

相关文章

  • angular-tree-component的使用详解

    angular-tree-component的使用详解

    这篇文章主要介绍了angular-tree-component的使用详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-07-07
  • JavaScript 命名空间 使用介绍

    JavaScript 命名空间 使用介绍

    使用JavaScript实现命名空间就没有这么舒服了,Javascript只有函数作用域,什么块儿啊、神马文件啊统统都认为是一个命名空间的,有时候因为一些重名问题导致的错误让人莫名其妙,难以调试解决
    2013-08-08
  • 详解微信小程序用定时器实现倒计时效果

    详解微信小程序用定时器实现倒计时效果

    这篇文章主要介绍了微信小程序用定时器实现倒计时效果,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • 深入理解JavaScript 参数按值传递

    深入理解JavaScript 参数按值传递

    本篇文章主要介绍了深入理解JavaScript 参数按值传递,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-05-05
  • JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解

    JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解

    这篇文章主要介绍了JavaScript浏览器对象模型BOM(BrowserObjectModel),结合实例形式较为详细的分析了BOM模型的常用对象与相关使用技巧,需要的朋友可以参考下
    2016-11-11
  • javascript中typeof的使用示例

    javascript中typeof的使用示例

    本文为大家介绍下javascript中typeof的使用,下面有个不错的示例,感兴趣的朋友可以参考下
    2013-12-12
  • javascript使用onclick事件改变选中行的颜色

    javascript使用onclick事件改变选中行的颜色

    javascript onclick事件改变选中行的颜色,方法简单,大家参考使用吧
    2013-12-12
  • JavaScript创建对象的方式小结(4种方式)

    JavaScript创建对象的方式小结(4种方式)

    这篇文章主要介绍了JavaScript创建对象的方式,结合实例形式总结分析了四种创建对象的方式,并附带分析了JavaScript对象复制的技巧,需要的朋友可以参考下
    2015-12-12
  • 让mocha支持ES6模块的方法实现

    让mocha支持ES6模块的方法实现

    这篇文章主要介绍了让mocha支持ES6模块的方法实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-01-01
  • 微信小程序新闻网站详情页实例代码

    微信小程序新闻网站详情页实例代码

    这篇文章主要介绍了微信小程序新闻网站详情页的实例代码,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-01-01

最新评论