前端技术 – 第 2 页

whistle 使用实践

2017年11月10日由 zciii 发表

whistle 是一款用 Node 实现的跨平台的 Web 调试代理工具，支持查看修改 http(s)、Websocket 连接的请求和响应内容。简而言之就是 Node 版的 Fiddler、Charles，不过这个工具能远比后两者更加适合 Web 开发者、使用更简单、功能也更加实用，而笔者使用了继续>

立即执行函数表达式(IIFE)

2017年5月24日由 zciii 发表

也许你没有注意到，我是一个对于专业术语有一点强迫症的人。所以，当我多次听到流行却易产生误解的术语「自执行匿名函数」，我最终决定将我的想法写进这篇文章里。更进一步地说，除了提供关于该模式究竟是如何工作的全面信息，事实上我还建议了我们应该怎样称呼这种模式。另外，如果你想跳过这里，你可以直接跳到立即调用继续>

在 2016 年学 JavaScript 是一种什么样的体验？

2016年10月20日由 zciii 发表

翻译：方应杭链接：https://zhuanlan.zhihu.com/p/22782487 来源：知乎嘿，我最近接到一个 Web 项目，不过老实说，我这两年没怎么接触 Web 编程，听说 Web 技术已经发生了一些变化。听说你是这里对新技术最了解的 Web 开发工程师？准确地说继续>

选座验证的优化

2016年8月3日由 zciii 发表

也许你看到过这个新闻：也许你还看过这个图：自从某FFF团把情人节电影院的单号位置电影票全买走之后，电影院发现，不能再这么纵容他们了，于是就给了售票系统验证用户选座的要求。在重构系统过程中，发现原来的验证逻辑非常复杂，搬运逻辑不如直接重写，选座验证逻辑也是下手的好机会回到出发点原始代码很复杂继续>

Simple CSS3 Dropdown Menu

2015年12月28日由 zciii 发表

<ul><li>Home</li>
  <li>About</li>
  <li>
    Portfolio
    <ul>
      <li>Web Design</li>
      <li>Web Development</li>
      <li>Illustrations</li>
    </ul>
  </li>
  <li>Blog</li>
  <li>Contact</li>
</ul>

<li>About</li>

<li>

Portfolio

<ul>

<li>Web Design</li>

<li>Web Development</li>

<li>Illustrations</li>

</ul>

</li>

<li>Contact</li>

</ul>

body {
  font-family: 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  padding: 20px 50px 150px;
  font-size: 13px;
  text-align: center;
  background: #E3CAA1;
}

ul {
  text-align: left;
  display: inline;
  margin: 0;
  padding: 15px 4px 17px 0;
  list-style: none;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
ul li {
  font: bold 12px/18px sans-serif;
  display: inline-block;
  margin-right: -4px;
  position: relative;
  padding: 15px 20px;
  background: #fff;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
ul li:hover {
  background: #555;
  color: #fff;
}
ul li ul {
  padding: 0;
  position: absolute;
  top: 48px;
  left: 0;
  width: 150px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
ul li ul li { 
  background: #555; 
  display: block; 
  color: #fff;
  text-shadow: 0 -1px 0 #000;
}
ul li ul li:hover { background: #666; }
ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

body {

font-family: 'Lucida Grande', 'Helvetica Neue', Helvetica, Arial, sans-serif;

padding: 20px 50px 150px;

font-size: 13px;

text-align: center;

background: #E3CAA1;

}

ul {

text-align: left;

display: inline;

margin: 0;

padding: 15px 4px 17px 0;

list-style: none;

-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);

}

ul li {

font: bold 12px/18px sans-serif;

display: inline-block;

margin-right: -4px;

position: relative;

padding: 15px 20px;

background: #fff;

cursor: pointer;

-webkit-transition: all 0.2s;

-moz-transition: all 0.2s;

-ms-transition: all 0.2s;

-o-transition: all 0.2s;

transition: all 0.2s;

}

ul li:hover {

background: #555;

color: #fff;

}

ul li ul {

padding: 0;

position: absolute;

top: 48px;

left: 0;

width: 150px;

-webkit-box-shadow: none;

-moz-box-shadow: none;

box-shadow: none;

display: none;

opacity: 0;

visibility: hidden;

-webkit-transiton: opacity 0.2s;

-moz-transition: opacity 0.2s;

-ms-transition: opacity 0.2s;

-o-transition: opacity 0.2s;

-transition: opacity 0.2s;

}

ul li ul li {

background: #555;

display: block;

color: #fff;

text-shadow: 0 -1px 0 #000;

}

ul li ul li:hover { background: #666; }

ul li:hover ul {

display: block;

opacity: 1;

visibility: visible;

}

from:http://cssdeck.com/labs/another-simple-css3-dropdown-menu

分类：前端技术

whistle 使用实践

立即执行函数表达式(IIFE)

在 2016 年学 JavaScript 是一种什么样的体验？

选座验证的优化

Simple CSS3 Dropdown Menu

防止RequireJS缓存加载的js包 | Prevent RequireJS from Caching Required Scripts

四种常见的 POST 提交数据方式

jQuery中的Deferred和promise

Calling Python from JavaScript in PyQt’s QWebkit

Understanding ECMAScript 6 arrow functions

Accessing JavaScript variable in an iframe, from the parent window on same domain

使用CSS3快速美化radio和checkbox【Quick Tip: Easy CSS3 Checkboxes and Radio Buttons】

IE9大表格（具有横向滚动）导致的下方空白（高度会变化）问题

IE9表格异常多了一个单元格、IE9大表格异常、Internet Explorer 9 not rendering table cells properly

SSI – Regular Expressions