transition 变换旋转移动放大

/* 变换时过渡的属性 */
* { 
transition:All 1s ease-in-out;    
-webkit-transition:All 1s ease-in-out;    
-moz-transition:All 1s ease-in-out;    
-o-transition:All 1s ease-in-out;
}

/* 180°旋转 */
*:hover {    
transform:rotate(180deg);    
-webkit-transform:rotate(180deg);    
-moz-transform:rotate(180deg);    
-o-transform:rotate(180deg);    
-ms-transform:rotate(180deg);
}

/* 放大 */
*:hover {    
transform:scale(1.2);    
-webkit-transform:scale(1.2);    
-moz-transform:scale(1.2);    
-o-transform:scale(1.2);    
-ms-transform:scale(1.2);
}

/* 移动 */
*:hover {    
transform:translate(0,-10px);    
-webkit-transform:translate(0,-10px);    
-moz-transform:translate(0,-10px);    
-o-transform:translate(0,-10px);    
-ms-transform:translate(0,-10px);
}

/* 旋转并且放大 */
*:hover {    
transform:rotate(180deg) scale(1.2);    
-webkit-transform:rotate(180deg) scale(1.2);    
-moz-transform:rotate(180deg) scale(1.2);    
-o-transform:rotate(180deg) scale(1.2);   
-ms-transform:rotate(180deg) scale(1.2);
}

时间： 2024-10-05 08:12:05

transition 变换旋转移动放大的相关文章

jquery图片查看插件，支持旋转、放大、缩小、拖拽、缩略图（仿qq图片查看）

最近做了一个jquery图片查看的插件,目的是能精确查看图片的详情,插件支持图片旋转.放大.缩小.拖拽.缩略图显示,界面效果是按照window的qq查看图片功能写的,当然不尽相同. 具体功能: 1. 多张图片切换,键盘左右键或左右箭头切换 2. 旋转 3. 放大,支持鼠标滚轮 4. 缩小,支持鼠标滚轮 5. 右下角缩略图 6. 拖拽大图 7. 全屏 PS:下面是插件各状态下效果,demo示例会在最后放出来. 全屏全屏是容器的最大化. 缩小可以点击缩小图标或者鼠标滚轮向下滚,可以缩小图片. 放

iOS 混合变换旋转 CGAffineTransform 的使用

在ios 中, Core Graphics 提供了一系列的函数可以在一个变换的基础上做深层次的变换,如果做一个既要缩放又要旋转的变换,以下的方法比较实用. CGAffineTransformScale(CGAffineTransform t, CGFloat sx, CGFloat sy) --放大缩小 CGAffineTransformRotate(CGAffineTransform t, CGFloat angle) --旋转的角度 CGAffineTransformTranslate(CG

iOS 混合变换旋转 CGAffineTransform

CSS3 动画-- 鼠标移上去，div 会旋转、放大、移动

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> div{ width:120px; height:120px;

CSS Transition (变换动画)

最近学习CSS的过程中,发现了不少有用的东西.包括一些神奇的,纯CSS的特效,只需简单的几笔即可完成jQuery实现的效果. CSS 3 中提供了一种属性,Transition(变换),这种属性能够实现在元素的某些属性的数值发生改变时产生过渡的效果.比如长度增加,能产生类似拉长的动画效果:颜色改变时,也可以利用Transition产生一种颜色渐变的效果. 转载原链接地址:http://blog.netsh.org/posts/css-transition-animate-tutorial_522

IOS视图旋转可放大缩小

- (IBAction)hideBut:(id)sender { if (self.flg) { [UIView animateWithDuration:0.3 animations:^{ self.meunBaseLayer.transform = CGAffineTransformRotate(self.meunBaseLayer.transform , 3.14); // 缩放是按比例缩放 self.meunBaseLayer.transform = CGAffineTransformSc

android 图片旋转移动放大缩小

图片的变化主要是matrix的变化,对matrix不懂的可以先了解下matrxi. public class FunnyView extends View { /* * 手指按下时可能是移动也可能是拖动 */ private static final int ZOOM = -1 ; private static final int DRAG = 1; private int mode = 0; // 第一个触控点 private PointF startPointF = new PointF

给图片添加缩放、旋转、放大手势

创建一个继承于uiimageview的子试图在头文件中添加手势 @interface LXQuaereEditImageView : LXBaseImageView <UIGestureRecognizerDelegate> @property (nonatomic,strong,readonly) UIPinchGestureRecognizer *pinchGestureRecognizer; @property (nonatomic,strong,readonly) UIPanGest

[WebGL入门]十七，递归处理和移动?旋转?缩放

注:文章译自http://wgld.org/,原作者杉本雅広(doxas),文章中如果有我的额外说明,我会加上［lufy:］,另外,鄙人webgl研究还不够深入,一些专业词语,如果翻译有误,欢迎大家指正. 本次的demo的运行结果模型坐标变换矩阵的好处上次,通过操作模型坐标变换矩阵,绘制了多个模型.这次,继续在此基础上,给多个模型再添加上旋转和放大缩小等处理.看过上一篇文章的人应该知道,在3D渲染的世界里,利用VBO和一部分坐标变换矩阵,只需要少量修改,就可以绘制出大量的模型.当然,计算量也

transition 变换 旋转 移动 放大

transition 变换 旋转 移动 放大的相关文章

transition 变换旋转移动放大

transition 变换旋转移动放大的相关文章