【前端技术】 网页顶部线形页面加载进度条
23 02 2016
网页顶部线形页面加载进度条

今天有朋友问我网页顶部线形loading怎么来实现。那么关于这个问题,写这篇文章来探讨下这个东西的实现方式。它的实现方法其实有很多。下面我会列出2种形式。一种是用简单的css3+jquery来实现的。一种是用原生JS来实现的。第一种是一个静态的实现方式,第二种则是动态的。为什么要加loading的效果一款好的产品,都需要有一个漂亮的loading界面。lodaing界面不仅能给用户带来良好的体验,而且有效的消除了程序加载等待过程中的枯躁感。loading进度条更是对当前加载进度的一个良好反馈。从0%-100%的加载进度可以有效的告知用户还有多久即可打开页面。带有进度条的loading界面在程序中并不罕见,但是在 web

           
【JS前端效果】 大图jQuery多屏首页焦点图代码
22 02 2016
大图jQuery多屏首页焦点图代码

大图jQuery多屏首页焦点图代码,兼容主流浏览器使用方法:1、head区域引用文件jquery1 42 min js,jquery superslide 2 1 1 js, lrtk css2、在文件中加入区域代码3、js参数调用说明:titCell:导航元素对象(鼠标的触发元素对象)mainCell:切换元素的包裹层对象effect:动画效果(默认: "fade ")fade:渐显;|| left:左滚动;|| fold:淡入淡出autoPlay:自动运行(默认:false)delayTime:毫秒(默认:500);切换效果持续时间(一次切换效果执行所用的时间长度)

           
【JS前端效果】 模拟淘宝评价效果
20 02 2016
模拟淘宝评价效果

随着互联网的发展,不论是金融还是其他类型的公司,越来越多的倾向于拥有一个自己的电商网站,通过网络平台来完成自己线下、线上的交易,那么,在电商平台中,前端程序员们必须要拥有一套自己的开发思路、自己的电商模式,这其中包括我们的类似淘宝评价效果,这是前端开发中不可或缺的。如下,淘宝评价效果图: 模拟淘宝评价效果宝贝雨描述相符随着互联网的发展,不论是金融还是其他类型的公司,越来越多的倾向于拥有一个自己的电商网站,通过网络平台来完成自己线下、线上的交易,那么,在电商平台中,前端程序员们必须要拥有一套自己的开发思路、自己的电商模式,这其中包括我们的类似淘宝评价效果,这...

           
【转载优文】 前端web面试题大全
20 02 2016
前端web面试题大全

说白了,前端面试就那么几个死板的东西,问的浅了,无非就是HTML和CSS的相关hack,问的深了,也就是JS的一些闭包、作用域、冒泡之类的。高级前端人家可能连JS的基础都不会问,就直接问你有没有写过js插件、模块。当然,对于初级或者中级前端,这肯定有点难度,今天我们只为大家提供一些中级前端及初级的一些前端面试题,仅供参考。1 前端开发中用过哪些浏览器?这些浏览器的内核分别是什么?IE: trident内核Firefox:gecko内核Safari:webkit内核Opera:以前是presto内核,Opera现已改用Google Chrome的Blink内核Chrome:Blink(基于webkit,Google与Opera Software共同开发)2 描述一下cookies,sessionStorage和

           
【转载优文】 CSS3 @font-face介绍与用法
19 02 2016
CSS3 @font-face介绍与用法

@font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现,我们在Web的开发中使用字体不怕只能使用Web安全字体,你们当中或许有许多人会不自然的问,这样的东西IE能支持吗?当我告诉大家@font-face这个功能早在IE4就支持了你肯定会感到惊讶。我的Blog就使用了许多这样的自定义Web字体,比如说首页的Logo,Tags以及页面中的手写英文体,很多朋友问我如何使用,能让自己的页面也支持这样的自定义字体,一句话这些都是@font-face实现的,为了能让更多的朋友知道如何使用他,今天我主要把自己的一点学习过程贴上来和大家分享。首先我们一起来看看

           
【前端技术】 HTML中的base标签使用详解
18 02 2016
HTML中的base标签使用详解

在requireJS中,有一个属性叫baseURL,通过设置baseURL,我们可以将需要加载的文件路径写成相对于项目的,而不是相对于当前页面的。例如:假设我们的项目目录是 myproject ,里面有两个页面,一个是 myproject one html,另一个是 myproject html other html,他们都要加载 myproject js some js。如果我们将baseURL设置成 myproject ,则我们在加载该js的时候,这两个页面都可以使用相对于项目的路径 js some,而不是因为页面的路径不同而使用不同的相对路径。但是如果不使用requireJS,我们能不能实现类似于baseURL的功能呢?base标签其实,HTML中有一个base标签,可以产生类似的功能。举个例子:

           
【框架学习】 教你如何修改PHPCMS V9版本管理后台路径
16 02 2016
教你如何修改PHPCMS V9版本管理后台路径

PHPCMS V9由于采用了MVC的设计模式,所以它的后台访问地址是固定的,虽然可以通过修改路由配置文件来实现修改,但每次都修改路由配置文件对于我来说有点麻烦 了,而且一不小心就会出错。这里使用另外一个一劳永逸的方法,达到了方便修改访问后台入口的目的,整个修改共分两步:第一步:在网站根目录创建一个文件夹,以后就要通过这个文件夹进入后台登录界面的,所以文件夹名就要取一个不易被人轻易猜到的名称。这里作为演示,我就取为 admpub 好了。接着,在这个文件夹里新建一个文件index php,内容为:

           
【前端技术】 html前端网页字体设置
16 02 2016
html前端网页字体设置

以前做项目的时候就依葫芦画瓢的设置 { font-family:arial,”microsoft yahei”,simsun,sans-self; } 等类似的字体,然而当更多的设备和系统出现后,以前这样的设置已不能满足网页在各设备上的显示需求。就拿最简单的宋体(simsun)来说吧,在Windows系统下显示是一个比较容易阅读的字体,然而在Mac上简直无法直视,如下图给出一个优化前后页面的对比效果:因此,出于种种原因,促使我不得不去对字体做一个相应的了解对于网站字体设置,本文给出以下意见:移动端项目:font-family:Tahoma,Arial,Roboto,”Droid Sans”,”Helvetica Neue”,”Droid Sans Fallback”,”Heiti SC”,sans-self;pc端(含Mac)项目

           
【框架学习】 Phpcms V9管理后台密码重置的两种方法
08 02 2016
Phpcms V9管理后台密码重置的两种方法

最近,一个朋友使用NITC这个程序,忘记了管理密码,需要重置,研究了下方法,同样的类推:Phpcms V9管理后台密码忘记了应该怎么办?在这里,与大家分享下Phpcms V9管理后台密码重置的两种方法。在PC V9里边,重置管理密码就没有Phpcms2008那么容易,需要同时修改MD5密文和一个随机的加密验证码。password是md5小写加密的密码,encrypt则是对应的随机加密的验证码。了解这个机制之后,具体修改PC V9后台管理密码的方法是:首先打开XXX_admin表。把password字段值改为:0b817b72c5e28b61b32ab813fd1ebd7f再把encrypt字段值改为: 3vbCrK这样,修改的密码则是:“123456”。上面是Phpcms V9管理后台

           
【前端技术】 css去掉a标签点击后的虚线框
07 02 2016
css去掉a标签点击后的虚线框

outline是css3的一个属性,用的很少。声明,这是个不能兼容的css属性,在ie6、ie7、遨游浏览器都不兼容。outline控制的到底是什么呢?当聚焦a标签的时候,在a标签的区域周围会有一个虚线的框,这个框不同于border的是,它是不占有任何宽度的。当你取消焦点的时候,这个虚线框就会自然消失。你可以通过遨游、火狐或者ie的几个版本看到。而safari、opera、goole浏览器等本身就不支持这个效果,所以看不到。这个就是a标签被聚焦后出现了虚线框,也就是outline;基本上这个是没有用的效果,大多数情况下我们会希望不要出现这种效果,于是给a标签设置outline:none;

           
【前端技术】 HTML DIV+CSS 命名规范大全
07 02 2016
HTML DIV+CSS 命名规范大全

网页制作中规范使用DIV+CSS命名规则,可以改善优化功效特别是团队合作时候可以提供合作制作效率,具体DIV CSS命名规则CSS命名大全内容篇。常用DIV+CSS命名大全集合,即CSS命名规则我们开发CSS+DIV网页(Xhtml)时候,比较困惑和纠结的事就是CSS命名,特别是新手不知道什么地方该如何命名,怎样命名才是好的方法。一、命名规则说明1、所有的命名最好都小写2、属性的值一定要用双引号( " ")括起来,且一定要有值如 class= "helloweb " ,id= "helloweb "3、每个标签都要有开始和结束,且要有正确的层次,排版有规律工整4、空元素要有结束的tag或于开始的tag后加上 " "

           
【框架学习】 关于css3动画库框架—animate.css
04 02 2016
关于css3动画库框架—animate.css

animate css 是一个来自国外的 CSS3 动画库,它预设了抖动(shake)、闪烁(flash)、弹跳(bounce)、翻转(flip)、旋转(rotateIn rotateOut)、淡入淡出(fadeIn fadeOut)等多达 60 多种动画效果,几乎包含了所有常见的动画效果。对于小白同学们来说又是一个超大的福利。虽然借助animate css能够很方便、快速的制作 CSS3 动画效果,但还是建议看看animate css 的代码,也许你能从中学到一些东西。浏览器兼容:当然是只兼容支持 CSS3 animate 属性的浏览器,他们分别是:IE10+、Firefox、Chrome、Opera、Safari。1、引入文件

返回顶部