为了账号安全,请及时绑定邮箱和手机立即绑定
  • transform属性是静态属性,不是动画属性,一旦写到style里面,将会直接显示作用,无任何变化过程
    查看全部
  • // 设置一下缩放比例与基点位置 var proportion = $(document).width() / 1440; // 设置元素缩放 $boy.css({ transform: 'scale(' + proportion + ')' });
    查看全部
  • transition-timing-function:linear//定义过渡效果的速度曲线(匀速) transition-duration:5000ms//定义变化的速度,多少毫秒内完成。是必须设的,不然默认为0看不出效果
    查看全部
  • margin <p>外边距 padding 外边距
    查看全部
  • 页面之间的卷滚切换效果 页面的横向布局我们已经实现好了,那么如何实现页面与页面之间的切换呢? 一般来说要根据布局的结构来,大体有2种: 移动父容器,改变父容器的坐标 移动每一个子容器的坐标 显而易见,移动父容器简单很多,只需要改变父容器X轴的坐标就可以了。如果父容器中子元素有很多的话,那么我们会考虑第二种算法,可以做成动态加载,但是这种处理是超级麻烦,这里不讨论 改变坐标的处理可以分为2种: 传统的top,left坐标修改 CSS3中的transform属性 传统的就是修改元素style是坐标属性,这个没什么好说的,使用简单,一般都需要配合定时器使用。 CSS3引入了一个新的属性Transform transform 属性向元素应用 2D 或 3D 转换,该属性允许我们对元素进行旋转、缩放、移动或倾斜。其中会有一个值translate3d(x,y,z) 是用来控制元素的位置在页面上的三轴的位置的,translate3d这里指明了3d就是启用了3d加速,也就是启动GPU来处理,性能更强 过去,为了实现这种平滑的过渡效果,我们需要借助于Flash技术,现在只需要简单的使用CSS3 Transition的方法就可以实现,这是一个简单的动画属性 transition可以设置一些具体的参数,比如动画执行的时间,变化的算法、动画延时等等,具体大家可以搜索更细致的资料 这里需要特别注意的就是: transform属性是静态属性,不是动画属性,一旦写到style里面,将会直接显示作用,无任何变化过程 简单的一句话描述就是 通过设置transition的一些参数,让translate3d这个属性发生变化 如何通过translate结合transition改变元素的页面位置,我们具体看到右边的代码 通过点击"点击页面开始切换"出现页面切换的效果
    查看全部
  • function() { $("#block4").text('block4动画动画直接结束'); }
    查看全部
  • deferred,更优雅的控制异步代码回调。
    查看全部
  • ssss
    查看全部
  • list-style-type:none;//去除ul、li的原有样式
    查看全部
  • Swipe工厂方法
    查看全部
  • 在js中用闭包模拟封装
    查看全部
  • var container = $("#content"); // 获取第一个子节点是包含三个的wrap var element = container.find(":first"); // li页面数量 var slides = element.find("li"); // 获取容器尺寸 var width = container.width(); var height = container.height();
    查看全部
  • 不错哦
    查看全部
    0 采集 收起 来源:效果介绍

    2015-09-22

  • 课程要点
    查看全部
    0 采集 收起 来源:编程节奏

    2015-09-21

  • 给祖先节点上套一个限制显示区域的节点
    查看全部

举报

0/150
提交
取消
课程须知
本课程为高级案例课程,其中所用的大部分知识点不做深入剖析,只讲解如何使用,部分代码需要由你自己填充。 需要具备如下知识: 1、HTML4、HTML5 2、CSS2、CSS3 3、JavaScript、jQuery 4、面向对象思想
老师告诉你能学到什么?
1、如何实现页面的无缝滚动 2、如何实现视觉差效果 3、异步编程处理 4、CSS3动画过渡 5、JS动画实现 6、H5的音乐效果

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!