3月 292016
 

像腾讯云,阿里云 或后台管理系统,经常会用到拆分html的方式来实现页面的跳转。

可以想象一样,有这样一个简单的布局。顶部100%宽,具体像素高。左侧导航具体像素宽,顶部除外100%高度。右侧顶部除外高度,左侧除外宽度。这样简洁整齐的平凑,加上适当的色彩。最终的成品却是不一样的烟火。

美丽的外观加上心悦的功能,就会是一个漂亮的体验。这里要做的是。
1,html,css外观组合。
2,js,php,功能组合。因为这样的一种需求,很多地方都是公共的,比如顶部和左侧。只要更新右侧的内容就可以了。于是,就回到了文章的题目。将html拆分成几个html。其实,开设是想要这样的。查了下资料,说有几种做法。经过自己尝试,成功过的,体验很好的就一个。因为我也只做了这一个方法尝试。

那么,html的base标签上场了。在head标签中,base指向了页面内所要指向的跳转地址从指定的地方显示输入不再是浏览器。
http://www.w3chtml.com/html5/tag/base.html

3月 152016
 

站点注册登录的时候,防止恶意操作,会用到验证码。既然用了ci框架,里边也封装了captcha,那么就总结下流程和用法。

1,创建并保存验证码。
2,使用验证码。
3,验证验证码。

创建并保存验证码:

3月 112016
 

初始用ci框架,里边的一些规则可能会漏掉。这个时候,会出现不敢,不愿相信的问题。

1,比如,你想调用base_url方法时候,发现提示未定义(Call to undefined function base_url)。咋办呢。回过头去自信看ci官方文档OR搜索引擎找答案。

在这里,为了缩短时间,还是去搜索引擎找了。在这里就有答案。

http://stackoverflow.com/questions/7503302/how-to-get-base-url-in-codeigniter-2

想用base_url, 你就先在控制器中load url helper。或者,在autoload.php中设置load。又或者这样用:
$this->config->base_url();

2,css中(非ci框架,碰到了就记一下),通过background定义背景图片。如果背景图片的宽高和该div中定义的宽高不相符时候,会出现显示异常的问题。这个是需要追加上background-size属性的设置。

    background:url('/static/assets/image/common/logo.png');
    background-size:117px 49px;
 Posted by at 上午11:44
3月 092016
 

关于web方面,常用的js,css框架有jquery,bootstrap。php框架ci框架等。如今,移动端的使用更加频繁。对应用,网页(虽然移动端网页用的不那么多)体验要求也更高。有要求,就有人愿意去付出,去改变。其中,mui就是移动端一个比较好的框架。它伴着H5一起。既可以用在mweb上,也可以用在app上。

mui官网:http://dev.dcloud.net.cn/mui/

拿别人的东东,用的时候,也是一个尝试和摸索的过程。在有一个比较美的外观的情况下,就涉及到实际点的东西了。利用ajax方式,数据提交给服务器。

官网的ajax文档:http://dev.dcloud.net.cn/mui/ajax/

看看差不多就能理解了。然后自己动手。在这里,自己建立了一个html页面的表单,并在数据库里边建了一个表,准备给表单提交数据后存储来着。过程展示贴图如下。

Continue reading »

3月 032016
 

尝试尝试,学了下H5。做了第一个小demo。需要用到的点。
1,canvas绘图api,绘制曲线圆,绘制文字。
2,怎么表示时钟数字。通过二维数组矩阵,利用绘制的圆,通过1和0来表示是否需要绘制来绘制数字。
3,定时器启动,改变数字。
4,完整版。ball的绘制,以及ball的改变。还有ball移出了画面清除等等。
已经把代码贴在后边了,三个版本的。代码比较简单,看看就能了解。

http://www.vini123.com/demo/h5/clock.html

完整code: Continue reading »

2月 232016
 

大部分时候,我们会放弃系统的默认镶边,自定义自己想要的镶边。这个时候,就需要自己手动来写效果了。基本过程是这样的。
1,屏蔽系统的镶边。
2,自己写皮肤,写逻辑(拖拽窗体,resize窗体,最大化,最小化,关闭,恢复等)。
每个AIR都有一个默认的xml配置文件,这里边定义了一些参数。通过打开注释,改变下边两个参数来关闭系统的镶边。一个是关闭镶边,另一个是打开透明。

        <!-- The type of system chrome to use (either "standard" or "none"). Optional. Default standard. -->
        <systemChrome>none</systemChrome>

        <!-- Whether the window is transparent. Only applicable when systemChrome is none. Optional. Default false. -->
        <transparent>true</transparent>

通过以上的设置,关闭了系统的镶边显示。然后来看怎么写自定义的镶边。最大化,最小化这些,比较好处理。这里主要讲下自由拖拽和自由resize。air提供了一个很好的方法(nativeWindow.startResize),来启动窗体的自由resize。里边可以带参数。参数标明拖拽的八个方向。仅仅这个是不够的,还要定义鼠标效果。鼠标移上去,拖拽光标要显示出来,拖拽的时候,光标跟着走。这里细节还是比较多。先记下光标的实现。
1,自己定义光标的显示对象。(位图,自己绘制都行)。
2,通过Mouse.registerCursor注册光标。registerCursor方法有两个参数,第一个参数是光标的名字,后边调用的时候需要,第二个参数是一个BitmapData的数组。就是光标的显示。
3,通过调用Mouse.cursor方法来更换光标。
其实,到了这里。在做这些之前,系统就已经有了一些光标效果。如鼠标遇到输入的时候的输入光标,遇到按钮的时候手型光标。当然通过上边的步骤,可以实现光标的定义。

下边说下拖拽。八个方向(上,上左,上右,左,右,下,下左,下右),通过定义sprite和范围来启动。可以通过定义一个sprite,然后通过Rectange来区分,调用resize,也可以通过建立八个sprite,分配好坐标来resize。我自己用的是后边一种方法。感觉还行。
建立八个sprite,然后对八个sprite进行侦听MouseDown,RollOver,RollOut事件。MouseDown事件,用来启动拖拽的,RollOver来显示光标的,RollOut来恢复到默认光标的。
RollOver的时候,根据不同的Sprite,取不同的光标效果。然后按下的时候,关掉mouseChildren属性。要不拖拽的时候,会出现泄露等瑕疵。同时,侦听stage的mouseUp事件,这个用来恢复默认光标。仅仅RllOut是不够的。还有,在RollOut的时候,如果鼠标状态是mouseDown状态,应不恢复默认光标。

上边这些可以定义到一个父类里边,以后用的时候,直接继承过来。至于按钮这些,可以定义在子类中。还有如果窗体是不规则的,可以自由对待。好了,细节有一些。贴出完整的代码吧。还需要更完善一些。
Continue reading »

2月 162016
 

TweenMax除了有基础的运动,loader等功能外,还有一些特殊的功能。比如滤镜的缓动,中心旋转,投影的缓动,变色的缓动等。

这些用到了其插件。这些插件在plugins包下。特意提出来,使用方法也有点不一样。使用插件效果分两步。

1,使用TweenPlugin的静态activate方法激活相应的插件。

TweenPlugin.activate([GlowFilterPlugin , TransformAroundCenterPlugin]);

2,用TweenLite启用插件,设置插件参数。

createScale();
curRotation = int(720 * Math.random());
TweenLite.to(image , 1.5 , {glowFilter:{color:int(0xffffff * Math.random()), blurX:10, blurY:10, strength:1, alpha:1} ,
                transformAroundCenter:{scale:curScale, rotation:curRotation}});

注意:用这个需要去下载greensock。免费插件会相对少一些功能。可以网上找全的。

Continue reading »

11月 292015
 

比较热的站:ab站

http://www.acfun.tv/

http://www.bilibili.com/

直播那个火,有秀场,也有游戏直播。片地开花,各争艳。国内比较有名气的直播网站如下:

http://www.douyutv.com/

http://www.huya.com/

http://longzhu.com/

http://www.zhanqi.tv/

http://www.panda.tv/

http://www.kktv5.com/

http://kan.sina.com.cn/

http://cc.163.com/game/

http://www.hao123.com/video/lol

触手TV

网站地图