jq实现鼠标移动到 图片上放大,移开图片缩小效果(打算封装成插件)
先看代码
<script>
$(function() {
$('div').mouseover(function() {
$('img').animate({
opacity: '0.9',
width: '120%',
height: '120%',
left:"-10%"
});
}); $('div').mouseout(function() {
$('img').animate({
opacity: '1.0',
width: '100%',
height: '100%',
left:"0%"
});
});
})
</script>
不知道,大神们还有更加好的方法方式么?
jq实现鼠标移动到 图片上放大,移开图片缩小效果(打算封装成插件)的更多相关文章
- JS实现鼠标移上去图片停止滚动移开恢复滚动效果
这是在做个人站的时候展示项目成果,因为不光需要展示,还需要介绍详细内容,就在滚动展示的地方做了这个效果以便于点开想要看的项目. 首先,要做的是一个需要滚动的区域.我前边写过一个关于图片循环滚动的示例, ...
- 前端的图片压缩image-compressor(可在图片上传前实现图片压缩)
https://www.imooc.com/article/40038 https://www.jianshu.com/p/3ce3e3865ae2 前端的图片压缩image-compressor(可 ...
- 图片上传5-多个图片上传,独立项目Demo和源码
图片上传,一次性可以上传多个图片,每个图片可以有名字.URL.排序.备注等字段.这是区别于使用百度WebUploader等多图上传工具的地方. 项目相关图片 Jar包管理:Maven用到的框架:Spr ...
- 妈蛋:kinMaxShow轮播图异常,WebUploader图片上传坑爹,图片被压缩了
今天晚上在改造轮播图. 原来的代码是这样的: <div> <img src="${static}/image/index/banner/`.jpg" /> ...
- html5 图片上传,支持图片预览、压缩、及进度显示,兼容IE6+及标准浏览器
以前写过上传组件,见 打造 html5 文件上传组件,实现进度显示及拖拽上传,兼容IE6+及其它标准浏览器,对付一般的上传没有问题,不过如果是上传图片,且需要预览的话,就力有不逮了,趁着闲暇时间,给上 ...
- java向图片上写字,两个图片合并的方法
package writeimg; import javax.imageio.ImageIO; import java.awt.Color; import java.awt.Font; import ...
- SpringMVC 图片上传,检查图片大小
使用SpringMVC+Spring 前端提交图片文件到Controller,检查上传图片大小是否符合要求 直接上代码了 1.校验图片大小 这里提供出验证的方法,用于在需要校验的地方调用 /** * ...
- PHP部分--图片上传服务器、图片路径存入数据库,并读取
html页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...
- 前端手势控制图片插件书写四(图片上传及Ios图片方向问题)
1.在图片上传中,使用的input的type为File的属性.使用filereader的Api let that = this; var file = document.getElementById( ...
随机推荐
- android开发之自定义组件
android开发之自定义组件 一:自定义组件: 我认为,自定义组件就是android给我们提供的的一个空白的可以编辑的图片,它帮助我们实现的我们想要的界面,也就是通过自定义组件我们可以把我们要登入的 ...
- NGUI之输入文本框的使用
ToolBar中的两个红圈 另,代码如下:只需要定义一个变量即可,然后将控件drag到那里,真的是灰常方便呀 还有一个就是保存了(OK的响应),可以简单地理解为存档或读档
- bzoj 2938 AC自动机
根据题意建出trie图,代表单词的点不能走,直接或间接指向它的点也不能走.这样的话如果能在图中找到一个环的话就是TAK,否则是NIE. #include<iostream> #includ ...
- AJAX-初学AJAX本地环境配置
1.前段时间学习headfirst AJAX,发现有些概念比较陌生,理解起来比较困难,等看完了半本的JavaScript高级程序设计,再回头看这本AJAX,发现轻松了很多,但是遇到了一个问题,AJAX ...
- 一次更愚蠢的NOIP模拟赛
都可以从COGS上找到 纵横字谜(krizaljka) 时间限制: 1 Sec 内存限制: 32 MB 题目描述 给出两个单词,找到第一个相同的字母,然后第一个单词横数输出,第二个竖着输出形成十字形 ...
- Load Average
在Linux系统下面,有很多的命令可以查看系统的负载情况:比如top,uptime,w,示例如下: [wenchao.ren@l-cmsweb1.ops.cn1 ~]$ w 18:39:10 up 7 ...
- jQuery中的text()、html()和val()以及innerText、innerHTML和value
*jQuery中设置或者获取所选内容的值:text();设置或者获取所选元素的文本内容: html();设置或者获取所选元素的内容(包括html标记): val();设置或者获取表单字段的值(前提是表 ...
- Python基本数据类型之list
一.创建列表: li = [] li = list() name_list = ['alex', 'seven', 'eric'] name_list = list(['alex', 'seven', ...
- 初识JSLint及建议JS编码风格
可能都或多或少的知道JSLint是一个JavaScript的代码质量工具,一个JavaScript语法检查器和校验器,它能分析JavaScript问题并报告它包含的缺点. 被发现的问题往往是语法错误, ...
- Yocto开发笔记之《U-boot启动内核流程》(QQ交流群:519230208)
QQ群:519230208,为避免广告骚扰,申请时请注明 “开发者” 字样 ======================================================== 执行命令 ...