今天在写一个小的 CSS Demo,一个关于 3d 球的旋转动画,关于 CSS 3D,少不了会使用下面这几个属性: { transform-style: preserve-3d; perspective: 1000; transform: translate3d(); } 这个 Demo 你可以戳这里,大概是这样:CodePen Demo - 3D ball: 嗯,大概到了这个效果,想到了 CSS 混合模式 mix-blend-mode,寻思着,利用混合模式,是否能让效果更上一层楼或者碰撞出一些

DIV+CSS标准网页布局准备工作(上) 概述 使用"DIV+CSS"对网站进行布局符合W3C标准,采用这种方式布局通常是为了说明与HTML表格定位方式的区别.因为现在的网站设计标准中,已经不再使用表格定位技术,而是采用DIV+CSS的方式实现各种定位.通过使用div盒子模型结构将各部分内容划分到不同的区块,然后用css来定义盒子模型的位置.大小.边框.内外边距.排列方式等.简单地说,div用于搭建网站结构(框架).css用于创建网站表现(样式/美化).该标准简化了HTML页面代码,获

第一种:window.parent第二种:window.top 貌似两种都行 然后找上一层iframe里面的js函数可以这么写: window.parent.functionName(param1, param2); 然后找上一层里面的另一个框架里的html元素的话: window.parent.frames['topFrame'].document.getElementById('test1').innerHTML = t1;

Vue的 $parent,并不能准确找到上一层的控件,所以如果需要,需要填坑这个 bug,递归寻找下上级 // Find components upward function findComponentUpward (context, componentName, componentNames) { if (typeof componentName === 'string') { componentNames = [componentName] } else { componentNames =

两种方式: // 方式一 触发返回上一层页面事件,只会重新加载当前页面 window.addEventListener('pageshow', function(e) { if (e.persisted) { location.reload(); } }) // 方式二 不会出现刷新效果 history.pushState(null, null, document.URL); window.addEventListener('popstate', function(e) { history.pu

今天又学了一种新方法,其实不算新,只是我不知道而已,想想学了一年多,现在什么动效都能写点出来了,但是一些基础的东西还是掌握不好,所以我现在依然会一遍遍的复习h5和css3,这就是自学的坏处,不知道的东西不知道怎么去学,没有哪个视频或者书讲得很全的,几乎都有知识点没讲,我甚至看见过有几本书有些知识点讲错了(也有可能是我错了),好吧,言归正传,这个方法是定位,一张图片或者div要在一个已知的容器里左右对齐,上下对齐,或者说是居中吧,第一种方法若使用上一层盒子为参照物,那么应该修改上一层的盒子为当前盒

在我们设计制作一些网页的时候可能会用到半透明的效果,首先我们可能会想到用PNG图片处理,当然这是一个不错的办法,唯一的兼容性问题就是ie6 下的BUG,但这也不困难,加上一段js处理就行了.但假如我们需要一个半透明遮罩的弹出层,如登陆框.注册框.提示等,这时可能需要整个页面都要被半透 明的遮罩层覆盖,那么如用背景平铺的话,此时此刻也许就不是一个好办法了,图片大了会影响加载速度,图片小了同样会增加页面的渲染计算量,那么这时也许就 需要用CSS滤镜了. 假如有这样一个例子:“有一个DIV块,此DIV

在我们设计制作一些网页的时候可能会用到半透明的效果,首先我们可能会想到用PNG图片处理,当然这是一个不错的办法,唯一的兼容性问题就是ie6 下的BUG,但这也不困难,加上一段js处理就行了.但假如我们需要一个半透明遮罩的弹出层,如登陆框.注册框.提示等,这时可能需要整个页面都要被半透 明的遮罩层覆盖,那么如用背景平铺的话,此时此刻也许就不是一个好办法了,图片大了会影响加载速度,图片小了同样会增加页面的渲染计算量,那么这时也许就 需要用CSS滤镜了. 假如有这样一个例子:“有一个DIV块,此DIV

在Google Maps API的使用中,经常用到Clusterer来避免过密的Marker显示.但仔细看一下Clusterer的设置参数中并没有直接将某些Marker除外的方法,那遇到这样的需求,怎么做呢?以下是我从StackoverFlow上获得的解答,也是实践下来最佳的方法: // Create marker clusterer // map: google.maps.Map Object // markerArray: [google.maps.Marker Object1, googl

浮动就是让我们的元素脱离标准文档流,目的是为了布局好看! 浮动的现象: 脱离标准文档流被叫做脱流,同时会出现字围现象. 浮动的元素会相互贴靠,而且如果父容器空间足够大,则浮动的元素会正常紧靠也就是后一个元素会紧靠前一个元素.如果父容器空间不够大,那么元素会找上级的上级去紧靠,如果还找不到则继续找上级紧靠,没有了上级可靠那就靠边. 浮动的元素不分块级和行内类别,也就是说都可以设置宽高可边距. 浮动以后,同一行内的元素以顶边作为基线对齐. 为什么浮动会带来影响??????因为浮动元素不占父标签的高度

闲来无事,写了一个当下比较常见的下拉刷新/上拉加载的jquery插件,代码记录在这里,有兴趣将代码写成插件与npm包可以留言. 体验地址:http://owenliang.github.io/pullToRefresh/ 项目地址:https://github.com/owenliang/pullToRefresh 实现注意: 利用transition做动画时,优先使用transform:translate取代top,后者动画流畅度存在问题. 各移动浏览器对手势触摸的处理不同(简单罗列如下),但

原文地址:https://segmentfault.com/a/1190000014930183 感想:主要2D和3D转换.阴影效果. HTML代码: <nav> <ul> <li>Home</li> <li>Products</li> <li>Services</li> <li>Contact</li> </ul> </nav> CSS代码: html, bod

转眼间<.Net Discovery>系列文章已经推出1年了,本文为该系列的第10-13篇文章,在本文中将对以前所讲的.Net平台知识做一个小小的总结与机制分析,引出并重点介绍这些机制对程序性能的影响与改进建议.    本文将分为四部分,分别讲述了:垃圾回收机制.即时编译机制.异常处理机制.字符串驻驻留机制的原理与性能改进建议.<.Net Discovery>系列的每篇文章撰写耗时都在2天以上,转载时麻烦著名作者Aicken(李鸣),并且未经作者同意,禁止一切商业用途!    一.

原因: safari的webkit内核特性 解决方案: 在iframe外包裹一层div并另外设置其css属性为如下: -webkit-overflow-scrolling:touch; overflow:auto;

webpack 的别名好处大家也都了解, 但是 vue 的模板中, 对图片地址使用别名时总出现问题, 很久时间的时间都没找到解决办法, 一度认为是 webpack 的原因... alias: { 'src': path.resolve(__dirname, '../src'), 'assets': path.resolve(__dirname, '../src/assets'), 'components': path.resolve(__dirname, '../src/components')

1.布局规划 1.1 网格 网格系统是设计师在切分布局时作为参照的一组行和列. 1.2 布局辅助类 类名用于为布局添加样式.为了让样式可以重用,让类名表达其意图. .column { /* 一般列的样式 */ } .column-half { /* 占列宽的一半 */ } .row { /* 一般行的样式 */ } 另一种做法: .thing, .other-thing, .third-thing, .fourth-thing { /* 这里共用的样式 */ } 命名规范是高质量代码的重要组成部

1.映像:-webkit-box-reflect:blow 2px -webkit-gradient( linear, left top, left bottom, from(transparent), color-stop(0.52,transprent), to(white)); 2.对于页码的上一页以及下一页:prev以及next ---- rel属性 设置样式ol.pagination a[rel="prev"], ol.pagination a[rel="next&

1.基础url的获取 #测试网址: http://localhost/blog/testurl.php?id=5 //获取域名或主机地址 echo $_SERVER['HTTP_HOST']."<br>"; #localhost //获取网页地址 echo $_SERVER['PHP_SELF']."<br>"; #/blog/testurl.php //获取网址参数 echo $_SERVER["QUERY_STRING"

说明一下: 我的nav 设置的rootview 是 tabbarcontroller,登录界面是push进去的,所以,在登录界面,如果靠近最左边 向右滑动 会出现 tabbarcontroller的视图, iOS 7中在传统的左上角返回键之外,提供了右滑返回上一级界面的手势.支持此手势的是UINavigationController中新增的属性 interactivePopGestureRecognizer,即右滑返回只支持以UINavigationController为容器的ViewContr

方法就是在图片上面加一层DIV,将DIV的背景颜色调成rgba(0,0,0,0.3);即可

windows窗口对象(历史)history.go(),history.back(),history.forward(). 因为windows对象引用不是必须的.所以windows.history.go() == history.go()的. go()方法只有一个参数,可以是整数.负数.如果是正数,就前进.负数就是后退.(相当于Forward和Back的区别) 因此,后退一页,可用下面的代码:(后退多页,只需改变go的参数) window.history.go(-1): 要前进一页,只需要使用正