至于未来会怎么样 反正路还长 天总会亮

Life is a journey, not a destination, care should be the scenery along the way and the mood to see the scenery.

个人博客
  • ...
     前端 浏览(2)  tangzihan ++阅读原文
    3D相册制作
    我们要实现的效果 ![](http://www.zihanzy.com/uploads/images/article_con/202009/09/article_con_1599647229_dVPx7IItTE.gif) 搭建html结构...
  • ...
     前端 浏览(4)  tangzihan ++阅读原文
    使用swiper插件
    swiper插件用于做各种动画如轮播图,滑动菜单等等,通过swiper可以快速的得到我们想要的动画效果 官网地址:https://www.swiper.com.cn/ 使用方法 ![](http://)![](http://www.zihanzy.com/uploads/images/article_...
  • ...
     前端 浏览(5)  tangzihan ++阅读原文
    移动端click延迟300ms问题解决
    解决办法 1. 禁用浏览器缩放 2. 通过faskclick [github](https://github.com/ftlabs/fastclick) 在页面引入faskclick.js文件 添加如下代码 if ('addEventListener' in document) { document.addEventListener('...
  • ...
     前端 浏览(6)  tangzihan ++阅读原文
    移动端轮播图效果实现
    基本结构 基本css / 轮播图 / .focus{ position: relative; padding-top: 44px; overflow:hidden;//溢出的图片隐藏 } .focus ul{...
  • ...
     前端 浏览(1)  tangzihan ++阅读原文
    rem+css预处理+媒体查询与rem+flexible.js做网页适配
    引入 1. 页面布局文字能否随着屏幕大小变化而变化? 2. 流式布局和flex布局主要争对宽度布局,那高度如何设置? 3. 怎样让屏幕发生变化时候元素高宽等比例缩放? rem是什么? l rem是一种新的单位,是一个相对...
  • ...
     前端 浏览(0)  tangzihan ++阅读原文
    移动web开发介绍
    视口(viewport) 视口(viewport)浏览器显示页面内容的屏幕区域,视口可以分为布局视口,视觉视口和理想视口 布局视口(layout viewport) 一般移动设备的浏览器默认设置了一个布局视口,用于解决早期的PC端页面...
  • ...
     前端 浏览(0)  tangzihan ++阅读原文
    css3旋转木马效果
    body{ perspective: 1000px; } section{ width: 300px; height: 200px; margin: 150px auto; position: relative; transform-style: preserve-3d; animation: rotate 20s linear...
  • ...
     前端 浏览(2)  tangzihan ++阅读原文
    css3实现3d导航
    1.基本结构如下 ul{ margin:100px auto } ul li { width: 120px; height: 35px; list-style: none; } .box{ width: 100%; height: 100%; position:...
  • ...
     前端 浏览(3)  tangzihan ++阅读原文
    css3d实现两面翻转的盒子
    body{ perspective: 500px; } .box{ position: relative; width: 300px; height: 300px; margin: 100px auto; transform-style: preserve-3d; transition: all .4s; }...
  • ...
     前端 浏览(2)  tangzihan ++阅读原文
    CSS3d转换
    3D特点 近大远小 物体后面遮挡不可见 三维坐标系 x轴:水平向右 右边是正值,左边是负值 y轴:垂直向下 下面是正值,上面是负值 z轴:垂直屏幕 往外面是正值,往里面是负值 如下图: 不过在我们css中y轴向上...