| 共 14 篇文章 |
|
jQuery和CSS3炫酷图片和按钮点击波特效。相同的效果还有：jQuery和CSS3炫酷按钮点击波特效。<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"><link rel="stylesheet" href="./css/rippler.min.css"><script src="//ajax.googlea... 阅2246 转9 评0 公众公开 15-03-26 19:21 |
使用CSS3制作小球弹跳的动画效果。物体受重力的效果是一种非常复杂的动画过程，我们可以使用CSS来模拟这一效果。典型的重力效果是小球的弹跳效果。然后，我们就可以使用CSS的帧动画来制作小球受重力运动的效果。@keyframes bounce { from, to { transform: translateY(30vh);注意要记得修改小球的transform-origin，这使得小球动画可以很好的... 阅11590 转113 评0 公众公开 15-03-24 13:19 |
jQuery和CSS3打造GOOGLE样式的用户登录界面。svg> i> errorp> div> <div class="form-group"> <input type="checkbox" id="rem"> <label for="rem">Stay Signed inlabel> <button id="submit" type="submit" rip... 阅357 转5 评0 公众公开 15-03-14 13:16 |
4种CSS3超酷移动手机滑动隐藏侧边栏菜单特效。这四种效果分别是：默认的点击滑动侧边栏菜单效果、带3D transforms的滑动侧边栏效果、文字缩放和淡入淡出效果的滑动侧边栏以及使用translate来实现滑动侧边栏的效果。#tm:checked ~ .sidenav li:nth-child(1) b {transition-delay: 0.08s;}#tm:checked ~ .sidenav li:nth-child(2) b {transition-... 阅208 转0 评0 公众公开 15-03-13 13:29 |
使用HTML5和CSS3打造炫酷带缩略图的图片画廊。<label for=vallbona><img src="img/1-thumb.jpg" alt="" >label><input type="radio" id="vallbona" name="churchy"><label for="woodward"><img src="img/2-thumb.jpg" alt=""&... 阅191 转0 评0 公众公开 15-03-05 13:22 |
HTML5 canvas绘图的redo和undo功能的实现。为了实现canvas的redo/undo功能，我们需要保存canvas的快照（通过canvas的toDataURL方法来实现），将每一个快照都存储在一个数组cPushArray中，当我们每次往canvas中绘制线条的时候，我们都使用一个cPush方法来往数组中存储快照。if (cStep <cPushArray.length) { cPushArray.length = cStep;canva... 阅496 转0 评0 公众公开 15-03-04 19:18 |
jQuery和CSS3炫酷滚动页面内容元素动画特效插件。<div class="foo">div><div class="bar" data-move-x="-200px" data>div><script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js">script><script src="//cdnjs.cloudflare.com/ajax/libs/jq... 阅1093 转4 评0 公众公开 15-03-03 13:22 |
纯CSS鼠标从不同方向滑入图片产生不同的图片标题效果。<div class="multi-hover"> <span>Born Iman Abdulmajid, 1955span> <span>First appearance: <cite>Voguecite>, 1976span> <span>Also known as: Imanspan> <span>Actress in: <cite>Star Trek VIcite>s... 阅1943 转13 评0 公众公开 15-03-03 13:19 |
jQuery元素滚动动画库插件。ScrollMagic是一款制作各种HTML元素滚动动画效果的js库插件。ScrollMagic元素滚动动画库的特点有：git clone git://github.com/janpaepke/ScrollMagic.gitbower install scrollmagicnpm install scrollmagichttp://cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.0/ScrollMagic.min.js 使用方法... 阅1013 转4 评0 公众公开 15-03-02 13:28 |
使用CSS3制作图片开门展示标题特效。<div id="splitter"> <span>Road To Nowhere</span> <img src="road-to-nowhere.jpg" alt> <img src="road-to-nowhere.jpg" alt> <img src="road-to-nowhere.jpg" alt="" style="position: static; o... 阅993 转10 评0 公众公开 15-03-02 13:26 |
