自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

Tz。

If you want something in your life you've never had, you'll have to do something you've never done.

  • 博客(20)
  • 收藏
  • 关注

原创 js快速排序

快速排序(Quicksort)是对冒泡排序的一种改进,是一种分而治之算法归并排序的风格核心的思想就是通过一趟排序将要排序的数据分割成独立的两部分,其中一部分的所有数据都比另外一部分的所有数据都要小,然后再按此方法对这两部分数据分别进行快速排序,整个排序过程可以递归进行,以此达到整个数据变成有序序列理论上的步骤:找到一个“支点”项目在数组中,可以是中心点,基准 在阵列中的第一项开始指针(左指针)。

2015-08-31 16:57:37 762

原创 纯css玩转三角形

如今css3盛行的时代,用canvas,svg以及linear-gradient,radio-gradient都能画出各种各样的图形。但是早在css2时代,画三角形就不是什么新鲜事。这里简单总结一下,也方便自己查阅。<div class="triangle-up"></div>写出通用结构, .triangle-up { width: 0;

2015-08-27 18:57:33 741

原创 流式布局之等比列缩放的盒子。

说到等比列布局,很多开发者便想到js,在响应式设计逐渐成为主流的今天,流式布局这个词即使放在一两年前也绝算不得是个新鲜词汇。下面是一个布局实例: <div class="item">here is somediv</div> <div class="item">here is somediv</div> <div class="item">here is somediv</di

2015-08-27 09:42:45 1313

原创 css3中webkit内核的滚动条样式

项目当中用到的滚动条样式,在别人的基础上调成适合自己的样式。(IE可以调试滚动条样式,firefox目前不能调试)::-webkit-scrollbar { width: 14px; }/* Track & scroll thickness */ ::-webkit-scrollbar-track { background-color:#ddd; }/* Track color */ ::-we

2015-08-24 11:46:49 1418

原创 pptv首页导航效果

周末闲时打开pptv看直播,然后发现它的导航改版了,还是比较酷的。出于对同行对热爱,自己也试着实现了一下:demo:http://output.jsbin.com/pomimajidu pptv效果:www.pptv.comhtml: <ul class="nav"> <li><a href="" id="pagenav_tv" channel="2" target="_pa

2015-08-23 17:23:23 870

原创 CSS 相对/绝对(relative/absolute)定位与jQuery的控制显示隐藏

http://codepen.io/tianzi77/pen/GJayoR

2015-08-19 09:59:00 5551 2

原创 两端居中

http://codepen.io/tianzi77/pen/GJayoR

2015-08-18 10:15:38 428

原创 javascript的简单逻辑题目

ps:纯属练习逻辑,项目开发中实际用处不大,老鸟飘过。题目1:求一个数组的最大ji数和最小偶数,并返回他们的和,如果一个数不存在则返回null。方法1: function evenOdd(arr){ var even=[],// 偶数 odd=[];//基数 for(var i=0;i<arr.length;i++) i

2015-08-17 21:31:02 3136

原创 css让footer永远保持在页面底部

案例1:只保存在页面底部,不固定。思路: html: <div class="body"> <header>我是头部</header> <div class="content">我是内容</div></div><footer>我是页脚,我总是固定在页面底部</footer> * { margin: 0; padding: 0;}html, body {

2015-08-17 16:54:45 4920 2

原创 css3围绕圆形旋转思路

http://codepen.io/tianzi77/pen/yNWYMO http://codepen.io/tianzi77/pen/bdydwK供参考

2015-08-16 22:35:49 7483

原创 被这个样式惊醒

http://codepen.io/tianzi77/pen/ZGPmgR在codepen上面看到的一个效果,我承认我是一个偏向审美的页面仔。如此效果却被同事说她并不喜欢玩样式。。。看看简介的html结构: <h1 class="gradient1">知不知对你倾上万缕爱意</h1> <p class="gradient2">Love is there in side,Make life

2015-08-11 17:10:11 652

原创 页面仔玩样式

demo地址:http://codepen.io/tianzi77/pen/pJYQLw结构html: <!--做一名合格的页面仔--> <div id="nav"> <ul> <li>hl</li> <li>hl</li> <li>hl</li> <li>hl</li>

2015-08-11 16:18:13 594

原创 网页遮层

<div class="mask-cj" style="display:none; position:absolute; width:100%; height:100%; top:0; left:0; z-index:888;background:rgba(0,0,0,0.5);"> </div>网站body顶部添加一层遮罩

2015-08-10 14:32:54 553

原创 也玩before 和after伪元素玩五颜六色的导航

demo地址:http://codepen.io/tianzi77/pen/gpEMxb伪元素能做什么呢? “伪元素”,顾名思义。它创建了一个虚假的元素,并插入到目标元素内容之前或之后。单词“pseudo”是希腊语的英译,它的基本意思是“说谎的,不诚实的,错误的。”因此叫伪元素是适合的。因为在文档中它不实际改变什么。相反的,它们是像幽灵一般的元素插入在css中,他们对用户是可见的,可以通过css控

2015-08-09 01:22:45 1551 2

原创 网站右侧导航条的玩法

最近心情很不好,各种工作生活上面的事情,让我很是受伤,刚出来工作感觉程序员确实是个神奇的行业,一个个都觉得自己的智商挺高的,哎,每天起早贪黑的上下班,还天天受气,真是日了够了,一个人一座城,一行代码到天明。或许真的老了,我居然前所未有的想拥有一个属于自己的家,渴望能吃到几口热喷喷的饭菜,能和最爱的人说上几句掏心掏肺的话,能一起见证风风雨雨。然而并没有什么用,就像js设计模式里面说的一个例子一样,追一

2015-08-08 14:34:42 3165

原创 禁止右键js

document.oncontextmenu = function (){ return false}

2015-08-04 14:24:44 417

原创 用svg实现上传图片进度条效果

demo:http://codepen.io/tianzi77/pen/jPXRKo<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <svg width="440" height="440"> <circle

2015-08-04 09:13:12 907

原创 表格js插件highcharts

中文官网:http://www.hcharts.cndemo:http://www.hcharts.cn/demo/index.php?p=27确实很方便。另外 var arr=[{ "endCount": 12, "hour": 0, "minutes": 0, "week": 0},{ "endCount": 2, "hour": 0, "minutes"

2015-08-03 19:04:18 572

原创 css大会网站顶部的一个特效

看到http://css.w3ctech.com/ 上一个效果觉得挺赞的。然后学些了一下。demo地址:http://codepen.io/tianzi77/pen/mJaLWq html结构很简单,就是一个p,2个span标签嵌套在a标签里面。 <a href="/" class="link-mallki"> 思君子兮未敢言 zhuangjia

2015-08-03 10:38:39 795

原创 css中的bfc怎么玩?

首先弄明白一个概念,上面是bfc? w3c是这样解释 BFC(Block Formatting Context)是Web页面中盒模型布局的CSS渲染模式。它的定位体系属于常规文档流。说通俗一点就是: float的值不为none position的值不为static或者relative display的值为 table-cell, table-caption, inline-block,

2015-08-02 19:17:40 639

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除