预览模式: 普通 | 列表

熟悉GIT命令行

花了两天时间学习vue.cli+github,命令行方式基本搞熟了,顺便给自己搞了个响应式简历:

 http://csdudu.github.io/

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 903

试用了一下微信小程序开发工具

结果发现,没有appid,无法上传,也就无法在手机上预览。

微信要求升到6.3.27,这个版本不是一个正式版本,因此只能从官网下载后安装,无法直接从手机上升级。

详细的API,现在也没心情看,只期待微信尽快开放正式的开发权限。听说玩过VUE的人,用这个应该比较好上手,这真是一个好消息 。

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 950

代我一好友,承接微信开发,有意向者请洽本人QQ:258754

H5游戏开发,flash小游戏开发。h5游戏白鹭引擎开发,兼容安卓和苹果所有手机,适配所有屏幕,最终生成原生js代码,手机浏览器运行,兼容性高。

资深工程师做h5游戏已经接近三年,团队由资深设计师,前端,后台组成,靠谱,下面是部分案例....

 

查看更多...

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1124
小H大学刚毕业,已经跟我学习了二个月左右。本周她决定试着求职,结果狗血事一堆...

查看更多...

Tags: 长沙前端求职 找工作 面试

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1205

 此次我帮老朋友做个小项目,升级黄花机场触摸屏软件(长沙的兄弟以后有机会可以到机场大厅试用)。

 应大家要求放个图:

老程序的实现方式,是HTML+FLASH+一个exe应用程序调用IE浏览器。分工是,activeX生成EXE程序,调用IE浏览器实现全屏。所有HTML文件都部署在本机,由FLASH来实现一些复杂交互,比如“大厅地图的放大缩小与拖动”。这个方案的不便之处显而易见:

1、必须使用一个加壳的exe程序,依赖IE6浏览器。

2、FLASH没有源文件提供无法升级。

 

因此,此次升级,准备采用以下方式:

1、在网上查到,chrome可以使用快捷方式直接全屏启动,这样写:

Javascript代码
  1. "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --kiosk ‪ http://localhost:88/index.html

此快捷方式要自动打开index.html,必须使用虚拟站点--kiosk这种方式简直就是为触摸屏量身定制的,已经屏蔽了右键!甚至光用鼠标都无法关闭,只能用键盘方式才能切出来。

 

2、用HTML5+CSS3+JS方式完全替代FLASH。采用强大的d3.js内核实现地图功能,具体方式我在另一篇文章中有演示

3、kiosk全屏方式只支持虚拟站点(比如localhost),我还必须在本机架设一个虚拟站点。我用node.js小程序实现了,不使用重量级的iis--当然,在这种单纯环境下,两者区别不大。

 另外,强大的node.js可以提供直接调用chrome启动的功能,写法如下:

Javascript代码
  1. // 调用chrome全屏方式  
  2. var childProcess = require('child_process');   
  3. childProcess.exec('start chrome --kiosk http://localhost:'+PORT+'/index.html');  

原来实现全部功能,需要点击2次,一次打开node.js的虚拟站点支持,一次打开chrome全屏方式,有了上面这个调用方式,只需要一次点击,就能完成全过程。我把这一次点击做成了一个windows的bat文件,并且采用开机自启动。

这样,每次一开机,就自动进入到chrome全屏状态,并且切换到index.html页面!全自动化!

chrome全屏启动方式参考:http://www.cnblogs.com/abel/p/3235839.html

分类:我们的作品 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1301

 按到朋友的一个项目,制作黄花机场的位置示意图,原来是几年前用Flash制作的。到现在就存在一些问题了,比如说代码不透明,不好进行编辑等。于是我直接用H5+Jquery+d3.js进行了一下重构。

 
制作过程有点小曲折。问题的核心当然是这个放大缩小拖动的程序。我用百度在国内范围找了半天,都没有很合适的。找到的几个都功能点小缺陷。不得已动用翻墙工具,用google搜索了一下,找到了一个:https://bl.ocks.org/mbostock/6123708
此程序核心用的是svg模型,用的是著名的d3.js框架。本来我想用纯DOM结构解决问题,可是实在没找到更好的,加上之前对SVG又有点研究,于是决定使用这个。找这个东西就花了几小时。
 
之后总体没碰到大的问题。对SVG的结构又有了更深的理解。
另外,对于d3 zoom的初始值的设定,默认情况老是从1开始,但是要求是从我设定的值开始。花了2小时用google查资料,最后发现了:
Javascript代码
  1. zoom.scale(ratio_init);  
  2. zoom.event(_svg.transition().duration(200));  
 
搞定了这个问题。
 
此次的最大收获就是:
国外好东西真多,google+英文关键词搜索才是王道。
分类:我们的作品 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 4512

前天到湖南五方科技进行前端技术培训

五方科技是服务于湖南教育服务行业的大型高科技企业。负责技术的颜总跟我是老友,此次邀请我给开发团队做了一个比较简单的前端技术培训。

培训地点:湖南五方科技有限公司 会议室
培训时间:7月25日晚上19点~22点

培训内容:前端技术概要+如何从平面技术到网页技术+前端实战经验分享 

 

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1084

长沙前端开发与培训  

分类:服务报价 | 固定链接 | 禁止评论 | 引用: 0 | 查看次数: 1117

 具体使用场景是:

1、移动端希望对body使用左右切换手势,
2、内部的某个子div,也要使用左右切换,
3、当对子切换时,希望body 对象不响应。
 
解决方法:
根据 event.target 不同写不同逻辑,根据这个前提,对父对象的响应代码如下:
 
Javascript代码
  1. var $t = $(evt.target);     //当前点击的target  
  2. if ($t.parents(".cols").length == 0) {       //上溯查询所有“.cols" 父对象,如果存在 ,则length>0  
  3.     .....  
  4. }  
 
在github中发issue,是一个解决疑难的途径,虽然官方指南不推荐这么做。但是这种小众插件没提供别的提问途径,只能这么干了。
 
分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1101

中小项目常用的前端技术选型方案

昨晚给一个朋友的项目做的前端选型分析,主要就是在项目启动时,给技术老大们选择一下,前端要选用哪些技术,这样方便招聘人手,搭建前端团队(其实在长沙一般也就是1-2个人)。

点击查看脑图

 

...废话,写的当然都是我自己熟悉的技术。我只会这么多啦,大牛们请无视。

分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 912

发现移动端使用WEUI的越来越多

 几个朋友提到的移动端框架,都不约而同的推荐了微信开源的WEUI,我自己最近也在试用Jquery+WEUI的一套框架:http://lihongxun945.github.io/jquery-weui/。作者在原WEUI的基础上,扩张了不少组件,比如日期选择框啥的,强!

试用觉得还行,就是用的都是PX单位,我慢慢的改为REM单位。

分类:开发心得 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 937
刚才群里有朋友跟我咨询(来自知乎上的朋友很多),问我是否愿意做有偿的单独辅导,我声明一下态度:
 
1、初学者,如果想到我家里来(长沙岳麓区-橡树湾-请自行百度),让我进行前端辅导,原则上150元每小时每人。如果3个人以上,一起听,大家一起打8折。
2、我不是专职做培训的,但我是专门做前端项目的。一般时间也没带学生,因此基本上你想听我讲,就是一二个人----这才是真正的"小班授课".因此你也不用计较那个费用。外面培训班的成本是我这个成本的10倍。
3、初学者带书来,我划记重点。书上有的、官网文档上有的东西,我一概不讲。如果你想细听,我细讲一遍也行。我基本只讲难点、疑点,传授实际项目和工作中需要的东西。
4、想做作业?我手头项目多的是。等你出去找工作时,需要准备的前端项目,我这里都有,可以让你挂名,前提是你真正参与了。
5、不承诺工作。但我长沙认识不少同行,学得好,不用我推荐,会有公司抢着要。
 
至于我的人品、学习质量甚至就业前景啥的,我就不解释了,认识我的人都了解。
 
有兴趣的朋友可以跟我私聊。

 

分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1005

SVG滤镜的具体用法

以高斯模糊(Gaussian Blur)为例,
<filter> 标签用来定义 SVG 滤镜。<filter> 标签使用必需的 id 属性来定义向图形应用哪个滤镜?
<filter> 标签必须嵌套在 <defs> 标签内。<defs> 标签是 definitions 的缩写,它允许对诸如滤镜等特殊元素进行定义。
 
XML/HTML代码
  1. <defs xmlns="http://www.w3.org/2000/svg">  
  2. <filter id="Gaussian_Blur">  
  3. <feGaussianBlur in="SourceGraphic" stdDeviation="2"/>  
  4. </filter>  
  5. </defs>  
 
 
几个注意点:
  • SVG结构代码要使用内联方式引入,否则外联CSS方式似乎不生效
  • 选择符搭配很自由,完全跟HTML一样,比如:svg#g1:hover g#gg{filter:url(#Gaussian_Blur)}
  • 如果是做按钮用途,按钮要设立一个透明的点击区域,否则鼠标只有点到有像素的位置才有效果。模糊效果要注意边缘与svg容器的边距。
分类:前端研究 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 947

长沙前端培训求职最值钱的5大必杀技

长沙前端培训求职最值钱的5大必杀技昨天有个商学院刚毕业找工作的妹子,请我参考个简历(前端),里面列举了node.js/vuejs/reactjs等各种高大上技术词汇。看完后,我第一时间说出我的观感:“你做的页面呢?PC端或是移动端页面呢?页面呢呢呢呢呢呢 ....”
 
没错,在长沙混IT,以橘子洲为界,湘江以西的开发团队,他们不需要组件化、模块化、自动化流、不需要node中间层,你就算天开眼搞个MVVM,技术总监他不敢用!----而湘江以东呢?他们压根就不知道有这些技术!
小团队需要前端做的,很简单,就是切图!排页面!再切!再排!5大黄金必杀技,按重要度排名如下:
 
一.移动端布局、定位
----不管好不好,好歹你要把页面排出来! 排出来! 排出来! 语义化再烂也行,嵌套再深也行,CSS再乱也行!inline-block/float/absolute分不清也行!因为这些技能,后端永远只会比你更烂!
 
二.移动端响应式方案
---页面都排出来了,要适合不同的屏幕吧?花半天时间学一下lib-flexible方法最佳,最不济你也得懂媒体查询(CSS堆不死你!)
 
三.手脚要快!
---快切图!快出页面!快速修改!上线前不修改100遍你都不叫做IT!cutterMan/EMMET/sublime/各种快捷键就是你每天不断重复的生活!如果你还说你会gulp+sass+browserSync那前面的当我没说!
 
四.使用iconfont图标
---如果你上游负责出设计的美工还只知道sprite,就不要让她知道还有iconfont这件事,否则小命难保---如果美工/前端都是你一个人,那么当我没说,反正是自己害自己。
 
五.一点点的jquery总要会吧?
---滑个图、弹个窗、切个框,这些总麻烦后端哥哥也不好意思。至于更麻烦的表单、控件、动效啥的,你不会,老板也不敢开你!当然,如果你是男性,开了就开了,你怕个啥?
 
本来写到这里就完了。结果我群里男同胞加了一句:“高颜值妹陀,夏不用管!摆看就要得!长沙欢迎你!”
 
 
 
分类:培训与招聘 | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 1289