因为最近做的项目刚好用到了这个实现,分享出来
 
class=enlarge 为div标签的class div img 为标签
.enlarge div img:hover{
transform: scale(3.2);
-webkit-transform: scale(3.0); /*Safari 和 Chrome*/
-moz-transform: scale(3.0); /*Firefox*/
-ms-transform: scale(3.0); /*IE9*/
-o-transform: scale(3.0); /*Opera*/
z-index:1;
border:2px solid black; (加黑色边框)
position: absolute;(谷歌浏览器只有加上这个,z-index才有效)
}

鼠标悬停,图片放大 CSS实现的更多相关文章

  1. jQuery鼠标悬停图片放大显示

    jQuery鼠标悬浮放于图片上之后图片放大显示的效果,即鼠标移到图片上图片突出显示,鼠标移开后恢复原来的模样,你可以在图片滚动效果中加上本特效,相信会更炫一些. <!DOCTYPE html P ...

  2. jquery图片放大插件鼠标悬停图片放大效果

    都知道jquery都插件是非常强大的,最近分享点jquery插件效果,方便效果开发使用. 一.HTML代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHT ...

  3. 浅谈CSS和JQuery实现鼠标悬浮图片放大效果

    对于刚刚学习网页前台设计的同学一定对图片的处理非常苦恼,那么这里简单的讲解一下几个图片处理的实例. 以.net为平台,微软的Visual Studio 2013为开发工具,当然前台技术还是采用CSS3 ...

  4. CSS鼠标悬停图片加边框效果,页面布局发生错位的解决办法

    CSS鼠标悬停图片加边框效果,页面布局发生错位的解决办法 .recomend-list{ width:1200px; a{ @extend %fl; margin-right: 30px; width ...

  5. 鼠标悬停,使用css切换图片

    鼠标悬停,使用css切换图片 当鼠标悬停在li上面切换另一张图片,只需添加下述css样式即可

  6. 常用css样式(文字超出部分用省略号显示、鼠标经过图片放大、出现阴影)

    文字超出部分用省略号显示: white-space: nowrap; /* 不换行 */ overflow: hidden; /* 超出部分不显示 */ text-overflow: ellipsis ...

  7. CSS3鼠标悬停图片上浮显示描述代码

    效果:http://hovertree.com/texiao/css3/20/ 效果图: 代码如下: <!doctype html> <html lang="zh" ...

  8. jQuery css3鼠标悬停图片显示遮罩层动画特效

    jQuery css3鼠标悬停图片显示遮罩层动画特效 效果体验:http://hovertree.com/texiao/jquery/39/ 效果图: 源码下载:http://hovertree.co ...

  9. HTML5+CSS3鼠标悬停图片特效

    点击预览效果            下载该特效: HTML5+CSS3鼠标悬停图片特效.zip 特效说明: 一款HTML5+CSS3鼠标悬停图片事件网页特效,集合了最流行鼠标悬停图片文字.图片动画移动 ...

  10. 15款css3鼠标悬停图片动画过渡特效

    分享15款css3鼠标悬停图片动画过渡特效.这是一款15款不同效果的css3 hover动画过渡效果代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class ...

随机推荐

  1. HDU1166 敌兵布阵(线段树)

    C国的死对头A国这段时间正在进行军事演习,所以C国间谍头子Derek和他手下Tidy又开始忙乎了.A国在海岸线沿直线布置了N个工兵营地,Derek和Tidy的任务就是要监视这些工兵营地的活动情况.由于 ...

  2. SQL——按照季度,固定时间段,分组统计数据

    最近在工作中接到了一个需求,要求统计当月以10天为一个周期,每个周期的数据汇总信息.假设有一张表如下: 表table_test中 ID           AMOUNT         CREATE_ ...

  3. php header设置页面编码

    php header设置页面编码 未分类 PHP 页面编码声明方法详解(header或meta) http://www.jb51.net/article/22501.htm PHP 页面编码声明与用h ...

  4. display: run-in

    If a sibling block box (that does not float and is not absolutely positioned) follows the run-in box ...

  5. Python学习——列表

    定义:1.列表(list)是由一系列特定顺序排列的元素组成,可以包含字母,数字或者将任何东西加入列表. 2.列表的标识符号为 [ ],函数名称为list 3.列表是有序的 相关概念: 元素:列表中的值 ...

  6. Python 解决面试题47 不用加减乘除做加法

    在看<剑指Offer>过程中,面试题47不用加减乘除做加法,给出的思路是使用二进制的异或以及与运算,总之就是使用二进制.但是在使用Python实现的过程中,对于正整数是没有问题的,但是对于 ...

  7. Python+selenium打开网页

    东西都安装好了,是不是都迫不及待的想要运行一个程序呢? 不过不幸的是,在正式编程打开网页之前,我们还需要做一件事:下载驱动. 据说,在很久之前的selenium1和2中,驱动是被内嵌在selenium ...

  8. The Lisp Curse /Lisp魔咒

    The Lisp Curse /Lisp魔咒 http://winestockwebdesign.com/Essays/Lisp_Curse.html 英文出处 http://www.soimort. ...

  9. [转载] Hadoop和Hive单机环境搭建

    转载自http://blog.csdn.net/yfkiss/article/details/7715476和http://blog.csdn.net/yfkiss/article/details/7 ...

  10. gdb分析core文件

    转载自:http://blog.chinaunix.net/u2/83905/showart_2134570.html 在Unix系统下,应用程序崩溃,一般会产生core文件,如何根据core文件查找 ...