html+jquery
代码编纂器:Dreamweaver CS5新建一个html文件,定名为test.html,用于讲解在jquery中如何使图片变大变小。
在test.html文件中,利用img标签建立一张图片,并设置其class为myimg,本家儿要用于下面经由过程该class获得图片对象。
在test.html文件内,利用button标签建立两个按钮,按钮名称为“使图片变大”和“使图片变小”。
在test.html文件中,给button按钮别离绑心猿意马onclick点击事务,当按钮被点击时,别离执行up()函数和down()函数。
在js标签中,利用width()方式和height()方式别离获得图片的宽度和高度,将它们别离保留在w变量和h变量中。
在js标签中,别离建立up()函数和down()函数,在函数内,别离利用$符号,经由过程类名myimg获得img图片对象,然后利用css()方式别离对图片的width(宽度)和height(高度)进行设置,实现图片的放大和缩小,代码如下:
在浏览器打开test.html文件,别离点击按钮,查看实现的结果。
0 篇文章
如果觉得我的文章对您有用,请随意打赏。你的支持将鼓励我继续创作!